<!DOCTYPE html>
<html lang="zh-CN">
<head>
  <meta charset="utf-8">
  <meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" name="viewport">
  
  <title itemprop="name">sourceshare | 楓の葉小窝</title>
  
    <link rel="shortcut icon" href="/images/favicon.ico">
  
  <meta http-equiv="x-dns-prefetch-control" content="on">
  <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Noto+SerifMerriweather|Merriweather+Sans|Source+Code+Pro|Ubuntu:400,700|Noto+Serif+SC" media="all">
  <link rel="dns-prefetch" href="//cdn.jsdelivr.net">
  <link rel="stylesheet" id="saukra_css-css" href="/css/style.css" type="text/css" media="all">
  <link rel="stylesheet" href="/css/lib.min.css" media="all">
  <link rel="stylesheet" href="/css/font.css" media="all">
  <link rel="stylesheet" href="/css/insight.css" media="all">
  <link rel="stylesheet" href="/css/jquery.fancybox.min.css" media="all">
  <link rel="stylesheet" href="/css/zoom.css" media="all">
  <link rel="stylesheet" type="text/css" href="/css/sharejs.css">
<!--   <link rel="stylesheet" id="saukra_css-css" href="https://2heng.xin/wp-content/cache/autoptimize/css/autoptimize_ad42a61f4c7d4bdd9f91afcff6b5dda5.css
" type="text/css" media="all"> -->
  <script>
  /*Initial Variables*/
  var mashiro_option = new Object();
  var mashiro_global = new Object();
  mashiro_option.NProgressON = true;
  /* 
   * 邮箱信息之类的东西可以填在这里，这些js变量基本都作用于sakura-app.js
   * 这样的设置仅是为了方便在基于PHP开发的主题中设置js变量，既然移植到了Node上，我想或许可以精简这一逻辑吧
   */
  mashiro_option.email_domain = "";
  mashiro_option.email_name = "";
  mashiro_option.cookie_version_control = "";
  mashiro_option.qzone_autocomplete = false;
  mashiro_option.site_name = "楓の葉lean";
  mashiro_option.author_name = "lean";
  mashiro_option.site_url = "https://linxuesong.github.io";
  mashiro_option.v_appId = "RmgA0rMeKIWWIkhSTpqhV4oG-gzGzoHsz";
  mashiro_option.v_appKey = "iwivlkfT6bGJRQS74SaKYjal";
  mashiro_option.mathjax = "0";
  mashiro_option.qq_api_url = "https://api.mashiro.top/qqinfo/"; 
  mashiro_option.qq_avatar_api_url = "https://api.mashiro.top/qqinfo/";

  // mashiro_option.jsdelivr_css_src = "https://cdn.jsdelivr.net/gh/moezx/cdn@3.4.5/css/lib.min.css";
  // mashiro_option.float_player_on = true;

  /*End of Initial Variables*/
  </script>
  <script type="text/javascript">
  var bg = "https://cdn.jsdelivr.net/gh/linxuesong/cdn/img/backgroundCover/cover(1).jpg,https://cdn.jsdelivr.net/gh/linxuesong/cdn/img/backgroundCover/cover(2).jpg,https://cdn.jsdelivr.net/gh/linxuesong/cdn/img/backgroundCover/cover(3).jpg,https://cdn.jsdelivr.net/gh/linxuesong/cdn/img/backgroundCover/cover(4).jpg,https://cdn.jsdelivr.net/gh/linxuesong/cdn/img/backgroundCover/cover(5).jpg,https://cdn.jsdelivr.net/gh/linxuesong/cdn/img/backgroundCover/cover(1).jpg,https://cdn.jsdelivr.net/gh/linxuesong/cdn/img/backgroundCover/cover(2).jpg,https://cdn.jsdelivr.net/gh/linxuesong/cdn/img/backgroundCover/cover(3).jpg".split(",");
  var bgindex = Math.floor(Math.random()*bg.length);
  if (!!window.ActiveXObject || "ActiveXObject" in window) { //is IE?
    alert('朋友，IE浏览器未适配哦~');
  }
  </script>
  <style type="text/css">
  .hljs-ln{border-collapse:collapse}.hljs-ln td{padding:0}.hljs-ln-n:before{content:attr(data-line-number)}
  </style>
  <style type="text/css">.site-top .lower nav{display:block !important;}.author-profile i,.post-like a,.post-share .show-share,.sub-text,.we-info a,span.sitename,.post-more i:hover,#pagination a:hover,.post-content a:hover,.float-content i:hover{color:#FE9600}.feature i,.download,.navigator i:hover,.links ul li:before,.ar-time i,span.ar-circle,.object,.comment .comment-reply-link,.siren-checkbox-radio:checked + .siren-checkbox-radioInput:after{background:#FE9600}::-webkit-scrollbar-thumb{background:#FE9600}.download,.navigator i:hover,.link-title,.links ul li:hover,#pagination a:hover,.comment-respond input[type='submit']:hover{border-color:#FE9600}.entry-content a:hover,.site-info a:hover,.comment h4 a,#comments-navi a.prev,#comments-navi a.next,.comment h4 a:hover,.site-top ul li a:hover,.entry-title a:hover,#archives-temp h3,span.page-numbers.current,.sorry li a:hover,.site-title a:hover,i.iconfont.js-toggle-search.iconsearch:hover,.comment-respond input[type='submit']:hover{color:#FE9600}.comments .comments-main{display:block !important;}.comments .comments-hidden{display:none !important;}background-position:center center;background-attachment:inherit;}
  </style>
  
  
  <!--标签统计样式-->
  <link rel="stylesheet" href="/css/tags.css" media="all">

  <!--百度访问数据统计-->
  <script>
  var _hmt = _hmt || [];
  (function() {
    var hm = document.createElement("script");
    hm.src = "https://hm.baidu.com/hm.js?d67a00154871861401ec8c26b0bdaf5d";
    var s = document.getElementsByTagName("script")[0]; 
    s.parentNode.insertBefore(hm, s);
  })();
  </script>



<meta name="generator" content="Hexo 5.4.0"><link rel="alternate" href="/atom.xml" title="楓の葉小窝" type="application/atom+xml">
<link rel="stylesheet" href="/css/prism-tomorrow.css" type="text/css"></head>

<body class="page-template page-template-user page-template-page-analytics page-template-userpage-analytics-php page page-id-1297 chinese-font serif isWebKit">
  <div class="scrollbar" id="bar">
  </div>
  <a href="#" class="cd-top faa-float animated"></a>
  <section id="main-container">
    <div class="headertop filter-dot">
  <div id="banner_wave_1"></div>
  <div id="banner_wave_2"></div>
  <figure id="centerbg" class="centerbg">
    <div class="focusinfo no-select">
      <div class="header-tou">
        <a href="https://linxuesong.github.io">
          <img src="https://cdn.jsdelivr.net/gh/linxuesong/cdn/img/avatar.jpg">
        </a>
      </div>
      <div class="header-info">
        <p>Live your life with passion! With some drive!</p>
        <div class="top-social_v2">
          <li id="bg-pre">
            <img class="flipx" src="https://cdn.jsdelivr.net/gh/honjun/cdn@1.6/img/other/next-b.svg">
          </li>
          
            
              
                <li>
                  <a href="http://github.com/linxuesong" target="_blank" class="social-github" title="github">
                    <img src="https://cdn.jsdelivr.net/gh/linxuesong/cdn/img/social/github.png">
                  </a>
                </li>
              
            
              
                <li>
                  <a href="https://blog.csdn.net/lsxa123" target="_blank" class="social-github" title="csdn">
                    <img src="https://cdn.jsdelivr.net/gh/linxuesong/cdn/img/social/csdn.png">
                  </a>
                </li>
              
            
              
                <li>
                  <a href="https://www.cnblogs.com/linxuesong/" target="_blank" class="social-github" title="cnblog">
                    <img src="https://cdn.jsdelivr.net/gh/linxuesong/cdn/img/social/cnblog.jpg">
                  </a>
                </li>
              
            
              
                <li>
                  <a href="https://wuzhi.me/" target="_blank" class="social-github" title="wuzhi">
                    <img src="https://cdn.jsdelivr.net/gh/linxuesong/cdn/img/social/wuzhi.png">
                  </a>
                </li>
              
            
              
                <li>
                  <a href="https://space.bilibili.com/396134239/video" target="_blank" class="social-github" title="bilibili">
                    <img src="https://cdn.jsdelivr.net/gh/linxuesong/cdn/img/social/bilibili.png">
                  </a>
                </li>
              
            
              
                <li>
                  <a href="https://photo.weibo.com/6504280642/wbphotos/large/mid/4519020298017277/pid/0076biwily1gg2bf3v9wvj30f00kk75n" target="_blank" class="social-github" title="qq">
                    <img src="https://cdn.jsdelivr.net/gh/linxuesong/cdn/img/social/qq.png">
                  </a>
                </li>
              
            
              
                <li>
                  <a href="https://photo.weibo.com/6504280642/wbphotos/large/mid/4519020298017277/pid/0076biwily1gg2bf3v9wvj30f00kk75n" target="_blank" class="social-github" title="wechat">
                    <img src="https://cdn.jsdelivr.net/gh/linxuesong/cdn/img/social/wechat.png">
                  </a>
                </li>
              
            
          
          <li id="bg-next">
            <img src="https://cdn.jsdelivr.net/gh/honjun/cdn@1.6/img/other/next-b.svg">
          </li>
        </div>
      </div>
    </div>
  </figure>
  <div id="video-container" style="">
    <video style="object-fit: fill" id="bgvideo" class="video" video-name="" src="" width="auto" preload="auto">
    </video>
    <div id="video-btn" class="loadvideo videolive">
    </div>
    <div id="video-add">
    </div>
    <div class="video-stu">
    </div>
  </div>
  <div class="headertop-down faa-float animated" onclick="headertop_down()">
    <span>
      <i class="fa fa-chevron-down" aria-hidden="true">
      </i>
    </span>
  </div>
</div>
    <div id="page" class="site wrapper">
      <header class="site-header no-select gizle sabit" role="banner">
  <div class="site-top">
    <div class="site-branding">
      <span class="site-title">
        <span class="logolink moe-mashiro">
          <a href="/">
            <span class="sakurasono">楓の葉</span>
            <span class="shironeko">lean</span>
          </a>
        </span>
      </span>
    </div>
    <div class="searchbox search-form-submit">
      <i class="iconfont js-toggle-search iconsearch icon-search">
      </i>
    </div>
    <div id="show-nav" class="showNav mobile-fit">
      <div class="line line1">
      </div>
      <div class="line line2">
      </div>
      <div class="line line3">
      </div>
    </div>
    <div class="lower-cantiner">
      <div class="lower">
        <nav class="mobile-fit-control hide">
          <ul id="menu-new" class="menu">
            
              <li>
                <a href="/">
                  <span class="faa-parent animated-hover">
                    <i class="fa  fa-fort-awesome faa-shake" aria-hidden="true"></i>
                    首页
                  </span>
                </a>
                
              </li>
            
              <li>
                <a href="javascript:;">
                  <span class="faa-parent animated-hover">
                    <i class="fa  fa-archive faa-shake" aria-hidden="true"></i>
                    归档
                  </span>
                </a>
                
                  <ul class="sub-menu">
                    
                      <li>
                        <a href="/categories/%E6%8A%80%E6%9C%AF/">
                          <i class="fa fa-laptop" aria-hidden="true"></i>
                          技术
                        </a>
                      </li>
                    
                      <li>
                        <a href="/categories/%E7%94%9F%E6%B4%BB/">
                          <i class="fa fa-file-text-o" aria-hidden="true"></i>
                          生活
                        </a>
                      </li>
                    
                      <li>
                        <a href="/categories/%E8%B5%84%E6%BA%90/">
                          <i class="fa fa-cloud-download" aria-hidden="true"></i>
                          资源
                        </a>
                      </li>
                    
                      <li>
                        <a href="/categories/%E9%9A%8F%E6%83%B3/">
                          <i class="fa fa-commenting-o" aria-hidden="true"></i>
                          随想
                        </a>
                      </li>
                    
                      <li>
                        <a href="/categories/%E8%BD%AC%E8%BD%BD/">
                          <i class="fa fa-book" aria-hidden="true"></i>
                          转载
                        </a>
                      </li>
                    
                  </ul>
                
              </li>
            
              <li>
                <a href="javascript:;">
                  <span class="faa-parent animated-hover">
                    <i class="fa  fa-area-chart faa-vertical" aria-hidden="true"></i>
                    文章统计
                  </span>
                </a>
                
                  <ul class="sub-menu">
                    
                      <li>
                        <a href="/analytics/">
                          <i class="fa fa-area-chart" aria-hidden="true"></i>
                          统计
                        </a>
                      </li>
                    
                      <li>
                        <a href="/archives/">
                          <i class="fa fa-calendar" aria-hidden="true"></i>
                          日历
                        </a>
                      </li>
                    
                      <li>
                        <a href="/tags/">
                          <i class="fa fa-tag" aria-hidden="true"></i>
                          标签
                        </a>
                      </li>
                    
                      <li>
                        <a href="/categories/">
                          <i class="fa fa-bookmark" aria-hidden="true"></i>
                          分类
                        </a>
                      </li>
                    
                  </ul>
                
              </li>
            
              <li>
                <a href="javascript:;">
                  <span class="faa-parent animated-hover">
                    <i class="fa  fa-list-ul faa-vertical" aria-hidden="true"></i>
                    清单
                  </span>
                </a>
                
                  <ul class="sub-menu">
                    
                      <li>
                        <a href="/books/">
                          <i class="fa fa-th-list faa-bounce" aria-hidden="true"></i>
                          书单
                        </a>
                      </li>
                    
                      <li>
                        <a href="/bangumi/">
                          <i class="fa fa-film faa-vertical" aria-hidden="true"></i>
                          番组
                        </a>
                      </li>
                    
                      <li>
                        <a href="/music/">
                          <i class="fa fa-headphones" aria-hidden="true"></i>
                          歌单
                        </a>
                      </li>
                    
                      <li>
                        <a href="/movies/">
                          <i class="fa fa-video-camera" aria-hidden="true"></i>
                          电影
                        </a>
                      </li>
                    
                      <li>
                        <a href="/games/">
                          <i class="fa fa-gamepad" aria-hidden="true"></i>
                          游戏
                        </a>
                      </li>
                    
                      <li>
                        <a href="/gallery/">
                          <i class="fa fa-photo" aria-hidden="true"></i>
                          图集
                        </a>
                      </li>
                    
                  </ul>
                
              </li>
            
              <li>
                <a href="/comment/">
                  <span class="faa-parent animated-hover">
                    <i class="fa  fa-pencil-square-o faa-tada" aria-hidden="true"></i>
                    留言板
                  </span>
                </a>
                
              </li>
            
              <li>
                <a href="javascript:;">
                  <span class="faa-parent animated-hover">
                    <i class="fa  fa-link faa-shake" aria-hidden="true"></i>
                    友人帐
                  </span>
                </a>
                
                  <ul class="sub-menu">
                    
                      <li>
                        <a href="/links/">
                          <i class="fa fa-handshake-o" aria-hidden="true"></i>
                          小伙伴
                        </a>
                      </li>
                    
                      <li>
                        <a href="/friendlink_status/">
                          <i class="fa fa-heartbeat faa-shake" aria-hidden="true"></i>
                          健康值
                        </a>
                      </li>
                    
                  </ul>
                
              </li>
            
              <li>
                <a href="/donate/">
                  <span class="faa-parent animated-hover">
                    <i class="fa  fa-heart faa-pulse" aria-hidden="true"></i>
                    赞赏
                  </span>
                </a>
                
              </li>
            
              <li>
                <a href="/">
                  <span class="faa-parent animated-hover">
                    <i class="fa  fa-leaf faa-wrench" aria-hidden="true"></i>
                    关于
                  </span>
                </a>
                
                  <ul class="sub-menu">
                    
                      <li>
                        <a href="/sourceshare/">
                          <i class="fa fa-share-alt faa-vertical" aria-hidden="true"></i>
                          分享
                        </a>
                      </li>
                    
                      <li>
                        <a href="/sitelog/">
                          <i class="fa fa-calculator" aria-hidden="true"></i>
                          建站史
                        </a>
                      </li>
                    
                      <li>
                        <a href="/todolist">
                          <i class="fa fa-tasks" aria-hidden="true"></i>
                          任务书
                        </a>
                      </li>
                    
                      <li>
                        <a href="/about/">
                          <i class="fa fa-meetup" aria-hidden="true"></i>
                          我？
                        </a>
                      </li>
                    
                      <li>
                        <a href="/theme-sakura/">
                          <i class="fa iconfont icon-sakura" aria-hidden="true"></i>
                          主题
                        </a>
                      </li>
                    
                      <li>
                        <a href="/lab/">
                          <i class="fa fa-cogs" aria-hidden="true"></i>
                          Lab
                        </a>
                      </li>
                    
                      <li>
                        <a href="/dinoswords">
                          <i class="fa fa-coffee" aria-hidden="true"></i>
                          娱乐
                        </a>
                      </li>
                    
                      <li>
                        <a href="/client/">
                          <i class="fa fa-android faa-vertical" aria-hidden="true"></i>
                          客户端
                        </a>
                      </li>
                    
                  </ul>
                
              </li>
            
              <li>
                <a href="/atom.xml">
                  <span class="faa-parent animated-hover">
                    <i class="fa  fa-rss faa-pulse" aria-hidden="true"></i>
                    RSS
                  </span>
                </a>
                
              </li>
            	
          </ul>
        </nav>
      </div>
    </div>
  </div>
<!-- 和风天气-->
<div id="he-plugin-simple"></div>
<script>
WIDGET = {
  CONFIG: {
    "modules": "30124",
    "background": 4,
    "backgroundColor": "F5A623",
    "tmpColor": "FFFFFF",
    "tmpSize": 16,
    "cityColor": "FFFFFF",
    "citySize": 16,
    "aqiSize": 16,
    "weatherIconSize": "6",
    "alertIconSize": 18,
    "padding": "10px 10px 10px 10px",
    "shadow": "1",
    "language": "auto",
    "borderRadius": 5,
    "fixed": "true",
    "vertical": "bottom",
    "horizontal": "right",
    "right": "0",
    "top": "80",
    "key": "7438089786be4f2984b268f575a35fa8"
  }
}
</script>
<script src="https://widget.qweather.net/simple/static/js/he-simple-common.js?v=2.0"></script>
	<!-- 和风天气-->
</header>

          <link rel="icon" type="image/png" href="/medias/favicon.png">
    <link rel="icon" type="image/png" href="/img/favicon.ico">
   
    <!-- 导入css文件  -->
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/Yafine/cdn@3.2.1/source/box/css/fonts/fontsawesome/css/font-awesome.min.css"> 
    <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Arimo:400,700,400italic">
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/linxuesong/cdn/css/sourceshare/bootstrap.css">
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/linxuesong/cdn/css/sourceshare/xenon-core.css"> 
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/linxuesong/cdn/css/sourceshare/xenon-components.css">
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/linxuesong/cdn/css/sourceshare/xenon-skins.css">
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/linxuesong/cdn/css/sourceshare/nav.css">
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/linxuesong/cdn/css/sourceshare/search.css">
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/linxuesong/cdn/css/sourceshare/linecons.css">	
      
    <!--  <script src="//cdn.sencdn.com/widget2/static/js/bundle.js?t=16264" charset="utf-8" async=""></script>
    -->
    <!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]-->
    <style>
        footer.main-footer .go-up {
            width: 45px;
            float: right;
            position: fixed;
            right: -10px;
            bottom: 30px;
            z-index: 10;
            margin: 0;
            padding: 0;
            list-style: none
        }

        footer.main-footer .go-up a {
            display: inline-block;
            width: 35px;
            height: 35px;
            text-align: center;
            border-radius: 50%;
            background: rgba(123, 123, 123, .5);
            color: #fff;
            font-size: 20px;
            line-height: 35px;
            padding: 0
        }
        #search-list {
            display: none;
        }
        .logo-expanded img {
            border-radius: 50%;
            width: 100px;
            height: 100px;
        }
        .has-sub {
            cursor: pointer;
        }
  
    </style>

    <style seniversewidget="" data-styled-version="4.3.2"></style>
<!-- -->
<!--   <script> -->
<!--        var colophon_obj = document.getElementById("colophon"); -->
<!--        colophon_obj.style.display="none"; -->
<!--    </script> -->
<!-- -->

    <!-- 导入jquery  -->
    <script src="http://libs.baidu.com/jquery/1.10.2/jquery.min.js">
</script>

<div class="pattern-center-blank"></div>

    <div class="page-container">
        <div class="sidebar-menu toggle-others fixed" style="z-index:0;">
            <div class="sidebar-menu-inner">
                <header class="logo-env">
                    <div class="logo" style="margin-top:75px;margin-left:50px;"><a href="/" class="logo-expanded"><img
                                src="https://cdn.jsdelivr.net/gh/linxuesong/cdn/img/avatar.jpg"
                                width="100%" alt=""></a></div>
                    <div class="mobile-menu-toggle visible-xs"><a href="#" data-toggle="user-info-menu"><i
                                class="linecons-cog"></i></a><a href="#" data-toggle="mobile-menu"><i
                                class="fa-bars"></i></a></div>
                </header>
                <ul id="main-menu" class="main-menu">
                
                    <li>
                    <i class="linecons-lightbulb"></i>    
                    <span class="title">常用工具</span></a>
                        <ul>
                            <li><a href="#速查手册" class="smooth"><span class="title">速查手册</span></a></li>
                            <li><a href="#参考资料" class="smooth"><span class="title">参考资料</span></a></li>
                            <li><a href="#图床工具" class="smooth"><span class="title">图床工具</span></a></li>
                            <li><a href="#主机域名" class="smooth"><span class="title">主机域名</span></a></li>
                        </ul>
                    </li>
                    <li><a><i class="linecons-thumbs-up"></i> <span class="title">线上操作</span></a>
                        <ul>
                            <li><a href="#在线写作" class="smooth"><span class="title">在线写作</span></a></li>
                            <li><a href="#文件处理" class="smooth"><span class="title">文件处理</span></a></li>
                        </ul>
                    </li>
                    <li><a><i class="linecons-desktop"></i> <span class="title">素材资源</span></a>
                        <ul>
                            <li><a href="#图片素材" class="smooth"><span class="title">图片素材</span></a></li>
                            <li><a href="#在线配色" class="smooth"><span class="title">在线配色</span></a></li>
                        </ul>
                    </li>
                    <li><a><i class="linecons-search"></i> <span class="title">程序员</span></a>
                        <ul>
                            <li><a href="#API接口" class="smooth"><span class="title">API接口</span></a></li>
                            <li><a href="#设计素材" class="smooth"><span class="title">设计素材</span></a></li>
                        </ul>
                    </li>
                    <li><a><i class="linecons-cloud"></i> <span class="title">与我相关</span></a>
                        <ul>
                            <li><a href="#我的站点" class="smooth"><i class="linecons-doc"></i> <span
                                        class="title">我的站点</span></a></li>
                        </ul>
                    </li>
                    <li><a href="#更多导航" class="smooth"><i class="linecons-paper-plane"></i> <span
                                class="title">更多导航</span></a></li>
                </ul>
            </div>
        </div>
        <div class="main-content" style="z-index:1;">
            <nav class="navbar user-info-navbar" role="navigation">
                <ul class="user-info-menu left-links list-inline list-unstyled">
                    <li class="hidden-sm hidden-xs"><a href="#" data-toggle="sidebar"><i class="fa-bars"></i></a></li>
                    <li><a href="/" target="_blank" style="padding:30px 20px"><i class="fa fa-home"></i> 博客首页</a></li>                   
                    <li><a id="tp-weather-widget" style="padding:28px 20px"></a>
                        <script>
                            ! function (e, t, n, a, o, i, c, r) {
                                r = function () {
                                        i = t.createElement(n), c = t.getElementsByTagName(n)[0], i.src = o, i.charset =
                                            "utf-8", i.async = 1, c.parentNode.insertBefore(i, c)
                                    }, e.SeniverseWeatherWidgetObject = a, e[a] || (e[a] = function () {
                                        (e[a].q = e[a].q || []).push(arguments)
                                    }), e[a].l = +new Date, e.attachEvent ? e.attachEvent("onload", r) : e
                                    .addEventListener("load", r, !1)
                            }(window, document, "script", "SeniverseWeatherWidget",
                                "//cdn.sencdn.com/widget2/static/js/bundle.js?t=" + parseInt(((new Date).getTime() /
                                    1e8).toString(), 10)), window.SeniverseWeatherWidget("show", {
                                flavor: "slim",
                                location: "WX4FBXXFKE4F",
                                geolocation: !0,
                                language: "auto",
                                unit: "c",
                                theme: "auto",
                                token: "a39cd5a0-4024-4cb2-85c6-0250317058db",
                                hover: "enabled",
                                container: "tp-weather-widget"
                            })
                        </script>
                    </li>
                </ul>
            </nav>
           

            <!-- 搜索栏 --> 
                    <style type="text/css">
            body{/*清除浏览器自带样式*/
                margin: 0;
                padding: 0;
            }
            .box{/*最大的盒子*/
                width: 100%;
                /*background: yellow;*/
                height: 40px;
    <!-- 可选择背景图片删去
                background-image:url("https://ss1.bdstatic.com/kvoZeXSm1A5BphGlnYG/skin/880.jpg?2");
          -->
                background-size: 100%;
 
            }
            .box_log{/*log盒子*/
                width: 100%;
            }
 
            .box_log img{/*百度log*/
                width: 19.8%;
                margin-left: 49.4%;
                transform: translate(-50%);
                margin-top: 38px;
                margin-bottom: 19px;
            }
            .box_text{/*text搜索框盒子大小*/
                width: 100%;
                height: 36px;
            }
            .log_img{/*input框中的小相机*/
                position: absolute;
                left: 865px;
                top: 202px;
            }
            #text{
                width: 540px;
                height: 36px;
                box-sizing: border-box;
                margin-left: 20%;
                margin-top: 3px;
                text-indent: 4px;
            }
            #btn{
                width: 100px;
                height: 36px;
                background: #3385FF;
                border: 0px;
                letter-spacing: 1px;
                color: white;
                margin-left: -5px;
                font-size: 15px;
                box-sizing: border-box;
                transform: translateY(2px);
                box-sizing: border-box;
            }
            #btn:hover{
                cursor: pointer;
            }
            #search{
                width: 540px;
                /*background: yellow;*/
                margin: 0;
                padding: 0;
                margin-left: 355px;
                list-style: none;
                display: none;
                border: 1px solid #E3E5E4;
            }
            #search li{
                line-height: 36px;
                background: white;
            }
            #search li:hover{
                background: #F0F0F0;
            }
            .li1{
                text-indent: 4px;
            }
        </style>
        <div class="box">
            <div class="box_text">
                <!-- 搜索框中的相机图标 已删去
                <img src="https://cdn.jsdelivr.net/gh/linxuesong/cdn/img/logo/camera.svg" class="log_img"/>
                -->
                <input type="text" name="text" id="text" value=""/>
                <input type="button" name="bdyx" id="btn" value="百度一下" />
                <ul id="search">
                    <li class="li1" id="0" onclick="iptShow(this.id)"></li>
                    <li class="li1" id="1" onclick="iptShow(this.id)"></li>
                    <li class="li1" id="2" onclick="iptShow(this.id)"></li>
                <!--
                    <li class="li1" id="3" onclick="iptShow(this.id)"></li>
                    <li class="li1" id="4" onclick="iptShow(this.id)"></li>
                    <li class="li1" id="5" onclick="iptShow(this.id)"></li>
                    <li class="li1" id="6" onclick="iptShow(this.id)"></li>
                    <li class="li1" id="7" onclick="iptShow(this.id)"></li>
                    <li class="li1" id="8" onclick="iptShow(this.id)"></li>
                    <li class="li1" id="9" onclick="iptShow(this.id)"></li>
                
                -->
                </ul>
            </div>
        </div>
 
        <script>
            var otext = document.getElementById("text");  //获取input框
            ose = document.querySelector("#search");  //通过类名选择器 选择到search框
            lis = document.getElementsByClassName("li1");  //获取所有的li
            otext.onkeyup = function(){   //当在input框中键盘弹起发生事件
                ose.style.display = otext.value?"block":"none";  /*三目运算符,如果otext.value的值部位空,则block。*/
                var osc = document.createElement("script");  /*创建一个script标签*/
                osc.src = "https://sp0.baidu.com/5a1Fazu8AA54nxGko9WTAnF6hhy/su?wd="+otext.value+"&cb=houxiaowei";
                /*srcipt的src值引入百度的url,然后将otext文本框中输入的内容连接到url,在后面在运行自己的方法*/
                document.body.appendChild(osc);
                /*将创建好的script标签元素放入body中*/
 
                /*input框中按下回车根据input的值跳转页面*/
                if(event.keyCode==13){
                    /*将百度作为连接,传入input的值,并跳入新的页面*/
                    window.location.href = "https://www.baidu.com/s?ie=utf-8&f=8&rsv_bp=1&rsv_idx=1&tn=baidu&wd="+otext.value
                }
            }
 
            var count = 0;
            var search = 0;
            var arr = ose.children; /*获取ose下的所有li*/
            function houxiaowei(json){
                var jsonLength = 0;  /*json长度的初始值*/
//                    console.log(json.s);  打印json数据中的所有数据
                for(var x in json.s){   /*将循环的次数变成json的长度*/
                    jsonLength++;　　　　　
                }
//                    console.log(jsonLength);  打印json数据的长度
                for(var i=0;i<lis.length;i++){
                    if(jsonLength==0){  /*如果遍历出的长度等于0,li的值为空*/
                        arr[i].innerHTML = null;
                    }else{
                        if(json.s[i]!=null){/*如果json[i]的值不等于空,则将它的值放入li中*/
                            arr[i].innerHTML = json.s[i];
                        }
                    }
                }
                if(count==lis.length-1){
                    count=0;
                    search=0;
                }
                count++;
                search++;
            }
 
            /*单击li中的值显示在input框中*/
            function iptShow(thisId){
                otext.value = arr[thisId].innerHTML;
                window.location.href = "https://www.baidu.com/s?ie=utf-8&f=8&rsv_bp=1&rsv_idx=1&tn=baidu&wd="+otext.value
            }
            /*单击body中的任意地方隐藏li*/
            document.body.onclick = function(){
                ose.style.display = "none";
            }
 
            /*单击百度btn的时候触发,并跳到新的连接*/
            var btn = document.querySelector("#btn");
            btn.onclick = function(){
                /*获取当前input的值*/
                var otext = document.getElementById("text").value;
                /*将百度作为连接,传入input的值,并跳入新的页面*/
                window.location.href = "https://www.baidu.com/s?ie=utf-8&f=8&rsv_bp=1&rsv_idx=1&tn=baidu&wd="+otext
            }
        </script>
            <!-- end 搜索栏 -->
            <div style="height:50px;"> </div>
           
            <h4 class="text-gray"><i class="linecons-tag" style="margin-right:7px" id="速查手册"></i>速查手册</h4>
            <div class="row"><div class="col-sm-3"><div class="xe-widget xe-conversations box2 label-info" onclick="window.open(&quot;https://developer.mozilla.org/zh-CN/docs/Web/CSS/Reference&quot;,&quot;_blank&quot;)" data-toggle="tooltip" data-placement="bottom" title="" data-original-title="https://developer.mozilla.org/zh-CN/docs/Web/CSS/Reference"><div class="xe-comment-entry"> <a class="xe-user-img"><img data-src="https://ae01.alicdn.com/kf/Hd33626da4cac472d99e150ae80ac2ff4q.png" class="lozad img-circle" width="40" src="https://ae01.alicdn.com/kf/Hd33626da4cac472d99e150ae80ac2ff4q.png" data-loaded="true"></a><div class="xe-comment"> <a href="#" class="xe-user-name overflowClip_1"><strong>CSS参考-MDN</strong></a><p class="overflowClip_2">快速进入MDN的CSS参考手册</p></div></div></div></div><div class="col-sm-3"><div class="xe-widget xe-conversations box2 label-info" onclick="window.open(&quot;https://developer.mozilla.org/zh-CN/docs/Web/API&quot;,&quot;_blank&quot;)" data-toggle="tooltip" data-placement="bottom" title="" data-original-title="https://developer.mozilla.org/zh-CN/docs/Web/API"><div class="xe-comment-entry"> <a class="xe-user-img"><img data-src="https://ae01.alicdn.com/kf/Hd33626da4cac472d99e150ae80ac2ff4q.png" class="lozad img-circle" width="40" src="https://ae01.alicdn.com/kf/Hd33626da4cac472d99e150ae80ac2ff4q.png" data-loaded="true"></a><div class="xe-comment"> <a href="#" class="xe-user-name overflowClip_1"><strong>Web API参考-MDN</strong></a><p class="overflowClip_2">快速进入MDN的Web API参考</p></div></div></div></div><div class="col-sm-3"><div class="xe-widget xe-conversations box2 label-info" onclick="window.open(&quot;https://developer.mozilla.org/zh-CN/docs/Web/Events&quot;,&quot;_blank&quot;)" data-toggle="tooltip" data-placement="bottom" title="" data-original-title="https://developer.mozilla.org/zh-CN/docs/Web/Events"><div class="xe-comment-entry"> <a class="xe-user-img"><img data-src="https://ae01.alicdn.com/kf/Hd33626da4cac472d99e150ae80ac2ff4q.png" class="lozad img-circle" width="40" src="https://ae01.alicdn.com/kf/Hd33626da4cac472d99e150ae80ac2ff4q.png" data-loaded="true"></a><div class="xe-comment"> <a href="#" class="xe-user-name overflowClip_1"><strong>事件参考-MDN</strong></a><p class="overflowClip_2">快速进入MDN的事件参考</p></div></div></div></div><div class="col-sm-3"><div class="xe-widget xe-conversations box2 label-info" onclick="window.open(&quot;https://git-scm.com/book/zh/&quot;,&quot;_blank&quot;)" data-toggle="tooltip" data-placement="bottom" title="" data-original-title="https://git-scm.com/book/zh/"><div class="xe-comment-entry"> <a class="xe-user-img"><img data-src="https://git-scm.com/images/logo@2x.png" class="lozad img-circle" width="40" src="https://git-scm.com/images/logo@2x.png" data-loaded="true"></a><div class="xe-comment"> <a href="#" class="xe-user-name overflowClip_1"><strong>Git book</strong></a><p class="overflowClip_2">官方Git教程</p></div></div></div></div><div class="col-sm-3"><div class="xe-widget xe-conversations box2 label-info" onclick="window.open(&quot;https://www.staticfile.org/&quot;,&quot;_blank&quot;)" data-toggle="tooltip" data-placement="bottom" title="" data-original-title="https://www.staticfile.org/"><div class="xe-comment-entry"> <a class="xe-user-img"><img data-src="https://ae01.alicdn.com/kf/Hebf9e5b0992e452fb0af9f0584d256b7g.png" class="lozad img-circle" width="40" src="https://ae01.alicdn.com/kf/Hebf9e5b0992e452fb0af9f0584d256b7g.png" data-loaded="true"></a><div class="xe-comment"> <a href="#" class="xe-user-name overflowClip_1"><strong>Staticfile CDN</strong></a><p class="overflowClip_2">免费、快速、开放的 CDN 服务</p></div></div></div></div><div class="col-sm-3"><div class="xe-widget xe-conversations box2 label-info" onclick="window.open(&quot;http://jscdn.upai.com/&quot;,&quot;_blank&quot;)" data-toggle="tooltip" data-placement="bottom" title="" data-original-title="http://jscdn.upai.com/"><div class="xe-comment-entry"> <a class="xe-user-img"><img data-src="https://ae01.alicdn.com/kf/H0961ac0c572b4caea27e77a47f152b19U.png" class="lozad img-circle" width="40" src="https://ae01.alicdn.com/kf/H0961ac0c572b4caea27e77a47f152b19U.png" data-loaded="true"></a><div class="xe-comment"> <a href="#" class="xe-user-name overflowClip_1"><strong>又拍云JS库加速服务</strong></a><p class="overflowClip_2">APP界面截图参考</p></div></div></div></div><div class="col-sm-3"><div class="xe-widget xe-conversations box2 label-info" onclick="window.open(&quot;https://caniuse.com/&quot;,&quot;_blank&quot;)" data-toggle="tooltip" data-placement="bottom" title="" data-original-title="https://caniuse.com/"><div class="xe-comment-entry"> <a class="xe-user-img"><img data-src="https://ae01.alicdn.com/kf/H21eee713a2274f1596f73d434f76ad4aw.png" class="lozad img-circle" width="40" src="https://ae01.alicdn.com/kf/H21eee713a2274f1596f73d434f76ad4aw.png" data-loaded="true"></a><div class="xe-comment"> <a href="#" class="xe-user-name overflowClip_1"><strong>Can I use</strong></a><p class="overflowClip_2">Can I use... Support tables for HTML5, CSS3, etc</p></div></div></div></div>
            </div>
            <br>
            <h4 class="text-gray"><i class="linecons-tag" style="margin-right:7px" id="参考资料"></i>参考资料</h4>
            <div class="row"><div class="col-sm-3"><div class="xe-widget xe-conversations box2 label-info" onclick="window.open(&quot;https://docs.tzki.cn/es6/&quot;,&quot;_blank&quot;)" data-toggle="tooltip" data-placement="bottom" title="" data-original-title="https://docs.tzki.cn/es6/"><div class="xe-comment-entry"> <a class="xe-user-img"><img data-src="https://ae04.alicdn.com/kf/H147985c637ff42259f16d2a4400ea837k.jpg" class="lozad img-circle" width="40" src="https://ae04.alicdn.com/kf/H147985c637ff42259f16d2a4400ea837k.jpg" data-loaded="true"></a><div class="xe-comment"> <a href="#" class="xe-user-name overflowClip_1"><strong>ES6 入门教程</strong></a><p class="overflowClip_2">《ECMAScript 6 入门教程》是一本开源的 JavaScript 语言教程，全面介绍 ECMAScript 6 新引入的语法特性</p></div></div></div></div><div class="col-sm-3"><div class="xe-widget xe-conversations box2 label-info" onclick="window.open(&quot;https://www.pugjs.cn/api/getting-started.html&quot;,&quot;_blank&quot;)" data-toggle="tooltip" data-placement="bottom" title="" data-original-title="https://www.pugjs.cn/api/getting-started.html"><div class="xe-comment-entry"> <a class="xe-user-img"><img data-src="https://cdn.jsdelivr.net/gh/blogimg/HexoStaticFile2@latest/2020/07/10/c72ced84b64377d9b709d98865fe7d2c.png" class="lozad img-circle" width="40" src="https://cdn.jsdelivr.net/gh/blogimg/HexoStaticFile2@latest/2020/07/10/c72ced84b64377d9b709d98865fe7d2c.png" data-loaded="true"></a><div class="xe-comment"> <a href="#" class="xe-user-name overflowClip_1"><strong>Pug 模板引擎中文文档</strong></a><p class="overflowClip_2">Pug 是一款健壮、灵活、功能丰富的模板引擎，专门为 Node.js 平台开发。Pug 是由 Jade 改名而来。</p></div></div></div></div><div class="col-sm-3"><div class="xe-widget xe-conversations box2 label-info" onclick="window.open(&quot;https://www.npmjs.cn/&quot;,&quot;_blank&quot;)" data-toggle="tooltip" data-placement="bottom" title="" data-original-title="https://www.npmjs.cn/"><div class="xe-comment-entry"> <a class="xe-user-img"><img data-src="https://ae03.alicdn.com/kf/Ha6b9cbd364c34469bf1b3e33fe37ae9cn.jpg" class="lozad img-circle" width="40" src="https://ae03.alicdn.com/kf/Ha6b9cbd364c34469bf1b3e33fe37ae9cn.jpg" data-loaded="true"></a><div class="xe-comment"> <a href="#" class="xe-user-name overflowClip_1"><strong>npm 中文文档</strong></a><p class="overflowClip_2">npm 是 JavaScript 世界的包管理工具，并且是 Node.js 平台的默认包管理工具。通过 npm 可以安装、共享、分发代码，管理项目依赖关系。</p></div></div></div></div><div class="col-sm-3"><div class="xe-widget xe-conversations box2 label-info" onclick="window.open(&quot;https://www.webpackjs.com/concepts/&quot;,&quot;_blank&quot;)" data-toggle="tooltip" data-placement="bottom" title="" data-original-title="https://www.webpackjs.com/concepts/"><div class="xe-comment-entry"> <a class="xe-user-img"><img data-src="https://ae02.alicdn.com/kf/Hf9be67f4f5a44150aec70e2c428eab35V.jpg" class="lozad img-circle" width="40" src="https://ae02.alicdn.com/kf/Hf9be67f4f5a44150aec70e2c428eab35V.jpg" data-loaded="true"></a><div class="xe-comment"> <a href="#" class="xe-user-name overflowClip_1"><strong>webpack</strong></a><p class="overflowClip_2">webpack 是一个现代 JavaScript 应用程序的静态模块打包器(module bundler)</p></div></div></div></div><div class="col-sm-3"><div class="xe-widget xe-conversations box2 label-info" onclick="window.open(&quot;http://mongoosejs.net/&quot;,&quot;_blank&quot;)" data-toggle="tooltip" data-placement="bottom" title="" data-original-title="http://mongoosejs.net/"><div class="xe-comment-entry"> <a class="xe-user-img"><img data-src="https://cdn.jsdelivr.net/gh/blogimg/HexoStaticFile2@latest/2020/07/08/125b85d7b6cbdd3789bf4bf70bfb112b.png" class="lozad img-circle" width="40" src="https://cdn.jsdelivr.net/gh/blogimg/HexoStaticFile2@latest/2020/07/08/125b85d7b6cbdd3789bf4bf70bfb112b.png" data-loaded="true"></a><div class="xe-comment"> <a href="#" class="xe-user-name overflowClip_1"><strong>mongoosejs</strong></a><p class="overflowClip_2">让我们面对这样的困境, 编写MongoDB验证，转换和业务逻辑是非常麻烦的. 所以我们发明了Mongoose.</p></div></div></div></div><div class="col-sm-3"><div class="xe-widget xe-conversations box2 label-info" onclick="window.open(&quot;https://apidocjs.com/&quot;,&quot;_blank&quot;)" data-toggle="tooltip" data-placement="bottom" title="" data-original-title="https://apidocjs.com/"><div class="xe-comment-entry"> <a class="xe-user-img"><img data-src="https://ae04.alicdn.com/kf/He28fb8929ba043bc8b3b3b4a7808b0a36.jpg" class="lozad img-circle" width="40" src="https://ae04.alicdn.com/kf/He28fb8929ba043bc8b3b3b4a7808b0a36.jpg" data-loaded="true"></a><div class="xe-comment"> <a href="#" class="xe-user-name overflowClip_1"><strong>APIDOC</strong></a><p class="overflowClip_2">Inline Documentation for RESTful web APIs</p></div></div></div></div></div>
            <br>
            <h4 class="text-gray"><i class="linecons-tag" style="margin-right:7px" id="图床工具"></i>图床工具</h4>
            <div class="row"><div class="col-sm-3"><div class="xe-widget xe-conversations box2 label-info" onclick="window.open(&quot;https://7bu.top/&quot;,&quot;_blank&quot;)" data-toggle="tooltip" data-placement="bottom" title="" data-original-title="https://7bu.top/"><div class="xe-comment-entry"> <a class="xe-user-img"><img data-src="https://7bu.top/favicon.ico" class="lozad img-circle" width="40" src="https://7bu.top/favicon.ico" data-loaded="true"></a><div class="xe-comment"> <a href="#" class="xe-user-name overflowClip_1"><strong>去不图床</strong></a><p class="overflowClip_2">去不图床免费图片外链平台</p></div></div></div></div><div class="col-sm-3"><div class="xe-widget xe-conversations box2 label-info" onclick="window.open(&quot;https://pic.alexhchu.com/&quot;,&quot;_blank&quot;)" data-toggle="tooltip" data-placement="bottom" title="" data-original-title="https://pic.alexhchu.com/"><div class="xe-comment-entry"> <a class="xe-user-img"><img data-src="https://pic.alexhchu.com/favicon.ico" class="lozad img-circle" width="40" src="https://pic.alexhchu.com/favicon.ico" data-loaded="true"></a><div class="xe-comment"> <a href="#" class="xe-user-name overflowClip_1"><strong>晚风图床</strong></a><p class="overflowClip_2">晚风图床免费图片外链平台</p></div></div></div></div><div class="col-sm-3"><div class="xe-widget xe-conversations box2 label-info" onclick="window.open(&quot;https://www.99yyw.com/tu/&quot;,&quot;_blank&quot;)" data-toggle="tooltip" data-placement="bottom" title="" data-original-title="https://www.99yyw.com/tu/"><div class="xe-comment-entry"> <a class="xe-user-img"><img data-src="https://ae01.alicdn.com/kf/Hb7bb4759392e45089d26893f25139651O.jpg" class="lozad img-circle" width="40" src="https://ae01.alicdn.com/kf/Hb7bb4759392e45089d26893f25139651O.jpg" data-loaded="true"></a><div class="xe-comment"> <a href="#" class="xe-user-name overflowClip_1"><strong>综合图床</strong></a><p class="overflowClip_2">拥有阿里图床、京东、网易等多个图床。</p></div></div></div></div><div class="col-sm-3"><div class="xe-widget xe-conversations box2 label-info" onclick="window.open(&quot;http://pic.i5.gs/&quot;,&quot;_blank&quot;)" data-toggle="tooltip" data-placement="bottom" title="" data-original-title="http://pic.i5.gs/"><div class="xe-comment-entry"> <a class="xe-user-img"><img data-src="https://cdn.jsdelivr.net/gh/yumusb/blog_img/avatar.jpg" class="lozad img-circle" width="40" src="https://cdn.jsdelivr.net/gh/yumusb/blog_img/avatar.jpg" data-loaded="true"></a><div class="xe-comment"> <a href="#" class="xe-user-name overflowClip_1"><strong>坏男孩的Github图床</strong></a><p class="overflowClip_2">一个简单的GitHub图床</p></div></div></div></div><div class="col-sm-3"><div class="xe-widget xe-conversations box2 label-info" onclick="window.open(&quot;https://chuibi.cn/&quot;,&quot;_blank&quot;)" data-toggle="tooltip" data-placement="bottom" title="" data-original-title="https://chuibi.cn/"><div class="xe-comment-entry"> <a class="xe-user-img"><img data-src="https://cdn.jsdelivr.net/gh/yumusb/blog_img/avatar.jpg" class="lozad img-circle" width="40" src="https://cdn.jsdelivr.net/gh/yumusb/blog_img/avatar.jpg" data-loaded="true"></a><div class="xe-comment"> <a href="#" class="xe-user-name overflowClip_1"><strong>吹逼图床</strong></a><p class="overflowClip_2">可以定义自己的GitHub库上传</p></div></div></div></div></div>
            <br>

            <h4 class="text-gray"><i class="linecons-tag" style="margin-right:7px" id="主机域名"></i>主机域名</h4>
            <div class="row"><div class="col-sm-3"><div class="xe-widget xe-conversations box2 label-info" onclick="window.open(&quot;https://www.aliyun.com/&quot;,&quot;_blank&quot;)" data-toggle="tooltip" data-placement="bottom" title="" data-original-title="https://www.aliyun.com/"><div class="xe-comment-entry"> <a class="xe-user-img"><img data-src="https://ae01.alicdn.com/kf/H3388ad3aea834d2dbc173620539adaecX.png" class="lozad img-circle" width="40" src="https://ae01.alicdn.com/kf/H3388ad3aea834d2dbc173620539adaecX.png" data-loaded="true"></a><div class="xe-comment"> <a href="#" class="xe-user-name overflowClip_1"><strong>阿里云</strong></a><p class="overflowClip_2">全球领先的云计算及人工智能科技公司，阿里云为200多个国家和地区的企业、开发者和政府机构提供云计算基础服务及解决方案。阿里云云计算、安全、大数据、人工智能、企业应用、物联网等云计算服务。</p></div></div></div></div><div class="col-sm-3"><div class="xe-widget xe-conversations box2 label-info" onclick="window.open(&quot;https://cloud.tencent.com/&quot;,&quot;_blank&quot;)" data-toggle="tooltip" data-placement="bottom" title="" data-original-title="https://cloud.tencent.com/"><div class="xe-comment-entry"> <a class="xe-user-img"><img data-src="https://ae01.alicdn.com/kf/H63879ef7df4e4a0d8848c51b619c36195.png" class="lozad img-circle" width="40" src="https://ae01.alicdn.com/kf/H63879ef7df4e4a0d8848c51b619c36195.png" data-loaded="true"></a><div class="xe-comment"> <a href="#" class="xe-user-name overflowClip_1"><strong>腾讯云</strong></a><p class="overflowClip_2">腾讯云为数百万的企业和开发者提供安全稳定的云计算服务，涵盖云服务器、云数据库、云存储、视频与CDN、域名注册等全方位云服务和各行业解决方案。</p></div></div></div></div><div class="col-sm-3"><div class="xe-widget xe-conversations box2 label-info" onclick="window.open(&quot;https://www.west.cn/&quot;,&quot;_blank&quot;)" data-toggle="tooltip" data-placement="bottom" title="" data-original-title="https://www.west.cn/"><div class="xe-comment-entry"> <a class="xe-user-img"><img data-src="https://ae01.alicdn.com/kf/H2476fa8e14fe4df0ba5c4fee04c41489N.jpg" class="lozad img-circle" width="40" src="https://ae01.alicdn.com/kf/H2476fa8e14fe4df0ba5c4fee04c41489N.jpg" data-loaded="true"></a><div class="xe-comment"> <a href="#" class="xe-user-name overflowClip_1"><strong>西部数码</strong></a><p class="overflowClip_2">西部数码用户中心是西部数码用户管理后台，可在这里对个人帐号、域名、云服务器、虚拟主机、网站等进行修改和管理</p></div></div></div></div><div class="col-sm-3"><div class="xe-widget xe-conversations box2 label-info" onclick="window.open(&quot;https://leancloud.cn/&quot;,&quot;_blank&quot;)" data-toggle="tooltip" data-placement="bottom" title="" data-original-title="https://leancloud.cn/"><div class="xe-comment-entry"> <a class="xe-user-img"><img data-src="https://ae01.alicdn.com/kf/H15d07cd5b0254e50b57ef28a55f8fbfaV.png" class="lozad img-circle" width="40" src="https://ae01.alicdn.com/kf/H15d07cd5b0254e50b57ef28a55f8fbfaV.png" data-loaded="true"></a><div class="xe-comment"> <a href="#" class="xe-user-name overflowClip_1"><strong>LeanCloud</strong></a><p class="overflowClip_2">LeanCloud 为应用开发提供一站式解决方案，包括：数据存储、用户管理、消息推送、应用统计、社交分享、实时聊天等服务，让开发者彻底抛弃后端负担，专注于提升用户体验，最大限度提升产品发布、迭代周期，在市场上占领先机。</p></div></div></div></div><div class="col-sm-3"><div class="xe-widget xe-conversations box2 label-info" onclick="window.open(&quot;https://www.dnspod.cn/&quot;,&quot;_blank&quot;)" data-toggle="tooltip" data-placement="bottom" title="" data-original-title="https://www.dnspod.cn/"><div class="xe-comment-entry"> <a class="xe-user-img"><img data-src="https://ae04.alicdn.com/kf/U9f79ca1667e74fd7aba82a8ab6ba4719g.jpg" class="lozad img-circle" width="40" src="https://ae04.alicdn.com/kf/U9f79ca1667e74fd7aba82a8ab6ba4719g.jpg" data-loaded="true"></a><div class="xe-comment"> <a href="#" class="xe-user-name overflowClip_1"><strong>DNSPod</strong></a><p class="overflowClip_2">DNSPod是国内提供智能DNS产品的网站，致力于为各类网站提供高质量的电信、网通、教育网双线或者三线智能DNS免费解析。目前DNSPod已经是国内最大的免费DNS解析产品提供商</p></div></div></div></div><div class="col-sm-3"><div class="xe-widget xe-conversations box2 label-info" onclick="window.open(&quot;https://console.upyun.com/register/?invite=SJBGIgQ6I&quot;,&quot;_blank&quot;)" data-toggle="tooltip" data-placement="bottom" title="" data-original-title="https://console.upyun.com/register/?invite=SJBGIgQ6I"><div class="xe-comment-entry"> <a class="xe-user-img"><img data-src="https://ae03.alicdn.com/kf/Ue5b939c07c9040209ee5a35ab402f83bz.jpg" class="lozad img-circle" width="40" src="https://ae03.alicdn.com/kf/Ue5b939c07c9040209ee5a35ab402f83bz.jpg" data-loaded="true"></a><div class="xe-comment"> <a href="#" class="xe-user-name overflowClip_1"><strong>又拍云</strong></a><p class="overflowClip_2">国内知名企业级云服务商,在全球拥有1100多个自建CDN节点,10TB保有带宽,为25万用户提供CDN,云存储,HTTPS／SSL证书,WebP,云处理,短视频开发SDK,直播开发SDK,DDos高防等一站式加速解决方案!</p></div></div></div></div><div class="col-sm-3"><div class="xe-widget xe-conversations box2 label-info" onclick="window.open(&quot;https://www.dynadot.com/zh/&quot;,&quot;_blank&quot;)" data-toggle="tooltip" data-placement="bottom" title="" data-original-title="https://www.dynadot.com/zh/"><div class="xe-comment-entry"> <a class="xe-user-img"><img data-src="https://ae01.alicdn.com/kf/H7d54b7b0f0e64197b6862b1430a0b6fcI.png" class="lozad img-circle" width="40" src="https://ae01.alicdn.com/kf/H7d54b7b0f0e64197b6862b1430a0b6fcI.png" data-loaded="true"></a><div class="xe-comment"> <a href="#" class="xe-user-name overflowClip_1"><strong>dynadot</strong></a><p class="overflowClip_2">注册域名，赠送建站工具！Dynadot帮您轻轻松松制作精美网站！今天就注册域名，启动您的网站吧！</p></div></div></div></div><div class="col-sm-3"><div class="xe-widget xe-conversations box2 label-info" onclick="window.open(&quot;https://www.cloudflare.com/&quot;,&quot;_blank&quot;)" data-toggle="tooltip" data-placement="bottom" title="" data-original-title="https://www.cloudflare.com/"><div class="xe-comment-entry"> <a class="xe-user-img"><img data-src="https://ae04.alicdn.com/kf/Ub33818daa339436b8a1bf30b2032cc2dR.jpg" class="lozad img-circle" width="40" src="https://ae04.alicdn.com/kf/Ub33818daa339436b8a1bf30b2032cc2dR.jpg" data-loaded="true"></a><div class="xe-comment"> <a href="#" class="xe-user-name overflowClip_1"><strong>cloudflare</strong></a><p class="overflowClip_2">Here at Cloudflare, we make the Internet work the way it should. Offering CDN, DNS, DDoS protection and security, find out how we can help your site</p></div></div></div></div><div class="col-sm-3"><div class="xe-widget xe-conversations box2 label-info" onclick="window.open(&quot;https://www.namecheap.com/&quot;,&quot;_blank&quot;)" data-toggle="tooltip" data-placement="bottom" title="" data-original-title="https://www.namecheap.com/"><div class="xe-comment-entry"> <a class="xe-user-img"><img data-src="https://ae02.alicdn.com/kf/Ue132bd56457045a985e759e7634999f35.jpg" class="lozad img-circle" width="40" src="https://ae02.alicdn.com/kf/Ue132bd56457045a985e759e7634999f35.jpg" data-loaded="true"></a><div class="xe-comment"> <a href="#" class="xe-user-name overflowClip_1"><strong>namecheap</strong></a><p class="overflowClip_2">Buy a domain name and create your website today.</p></div></div></div></div><div class="col-sm-3"><div class="xe-widget xe-conversations box2 label-info" onclick="window.open(&quot;https://sg.godaddy.com/zh&quot;,&quot;_blank&quot;)" data-toggle="tooltip" data-placement="bottom" title="" data-original-title="https://sg.godaddy.com/zh"><div class="xe-comment-entry"> <a class="xe-user-img"><img data-src="https://ae01.alicdn.com/kf/U99566564f4d64a849a620cb67baf9781A.jpg" class="lozad img-circle" width="40" src="https://ae01.alicdn.com/kf/U99566564f4d64a849a620cb67baf9781A.jpg" data-loaded="true"></a><div class="xe-comment"> <a href="#" class="xe-user-name overflowClip_1"><strong>godaddy</strong></a><p class="overflowClip_2">GoDaddy致力于服务中小企业,近1,900万客户在此建立线上业务.提供域名注册申请,域名查询,域名买卖交易,域名转移,虚拟主机,VPS服务器,SSL证书,网站建设,外贸cms建站等一站式服务.域名购买,海外主机,企业建站请访问GoDaddy官网</p></div></div></div></div><div class="col-sm-3"><div class="xe-widget xe-conversations box2 label-info" onclick="window.open(&quot;https://www.freenom.com/&quot;,&quot;_blank&quot;)" data-toggle="tooltip" data-placement="bottom" title="" data-original-title="https://www.freenom.com/"><div class="xe-comment-entry"> <a class="xe-user-img"><img data-src="https://ae01.alicdn.com/kf/H16c10e578e5046cea972eca16d1499f7n.png" class="lozad img-circle" width="40" src="https://ae01.alicdn.com/kf/H16c10e578e5046cea972eca16d1499f7n.png" data-loaded="true"></a><div class="xe-comment"> <a href="#" class="xe-user-name overflowClip_1"><strong>freenom - 人人都熟悉的名字</strong></a><p class="overflowClip_2">Freenom是世界上第一个也是唯一的免费域名提供商。 我们的使命是把互联网带给世界人民，帮助各国发展自己的数字经济</p></div></div></div></div><div class="col-sm-3"><div class="xe-widget xe-conversations box2 label-info" onclick="window.open(&quot;https://www.000webhost.com/&quot;,&quot;_blank&quot;)" data-toggle="tooltip" data-placement="bottom" title="" data-original-title="https://www.000webhost.com/"><div class="xe-comment-entry"> <a class="xe-user-img"><img data-src="https://ae01.alicdn.com/kf/H90861c9264ff48d0aa061ee5570d65232.png" class="lozad img-circle" width="40" src="https://ae01.alicdn.com/kf/H90861c9264ff48d0aa061ee5570d65232.png" data-loaded="true"></a><div class="xe-comment"> <a href="#" class="xe-user-name overflowClip_1"><strong>Free Web Hosting</strong></a><p class="overflowClip_2">Absolutely free web hosting with cPanel, PHP &amp;amp; MySQL for a stunning blogging start. Get free website hosting together with a free domain name at no cost at all!</p></div></div></div></div><div class="col-sm-3"><div class="xe-widget xe-conversations box2 label-info" onclick="window.open(&quot;http://cdn.bnxb.com/&quot;,&quot;_blank&quot;)" data-toggle="tooltip" data-placement="bottom" title="" data-original-title="http://cdn.bnxb.com/"><div class="xe-comment-entry"> <a class="xe-user-img"><img data-src="http://cdn.bnxb.com/img/logo1.png" class="lozad img-circle" width="40" src="http://cdn.bnxb.com/img/logo1.png" data-loaded="true"></a><div class="xe-comment"> <a href="#" class="xe-user-name overflowClip_1"><strong>笨牛网 免费CloudFlare CDN 防御系统</strong></a><p class="overflowClip_2">笨牛网免费CDN基于CloudFlare授权合作伙伴计划 ,支持批量添加域名,批量添加IP黑名单,railgun加速,DNS/CNAME/IP三种方式高速接入CF全球CDN加速防御体系,同时提供免费的DNS托管管理控制面板</p></div></div></div></div></div>
            <br>
            <h4 class="text-gray"><i class="linecons-tag" style="margin-right:7px" id="在线写作"></i>在线写作</h4>
            <div class="row"><div class="col-sm-3"><div class="xe-widget xe-conversations box2 label-info" onclick="window.open(&quot;https://www.xiezuocat.com/&quot;,&quot;_blank&quot;)" data-toggle="tooltip" data-placement="bottom" title="" data-original-title="https://www.xiezuocat.com/"><div class="xe-comment-entry"> <a class="xe-user-img"><img data-src="https://ae01.alicdn.com/kf/H61af85bcc64b4f1e99b1d9bc690fd8c8M.png" class="lozad img-circle" width="40" src="https://ae01.alicdn.com/kf/H61af85bcc64b4f1e99b1d9bc690fd8c8M.png" data-loaded="true"></a><div class="xe-comment"> <a href="#" class="xe-user-name overflowClip_1"><strong>秘塔写作猫</strong></a><p class="overflowClip_2">人工智能在线写作。</p></div></div></div></div><div class="col-sm-3"><div class="xe-widget xe-conversations box2 label-info" onclick="window.open(&quot;https://www.yuque.com/&quot;,&quot;_blank&quot;)" data-toggle="tooltip" data-placement="bottom" title="" data-original-title="https://www.yuque.com/"><div class="xe-comment-entry"> <a class="xe-user-img"><img data-src="https://files.alexhchu.com/2020/08/18/92a49d12f7217.png" class="lozad img-circle" width="40" src="https://files.alexhchu.com/2020/08/18/92a49d12f7217.png" data-loaded="true"></a><div class="xe-comment"> <a href="#" class="xe-user-name overflowClip_1"><strong>语雀</strong></a><p class="overflowClip_2">面向个人和团队，提供与众不同的知识管理，打造轻松流畅的工作协同。</p></div></div></div></div><div class="col-sm-3"><div class="xe-widget xe-conversations box2 label-info" onclick="window.open(&quot;https://jsoneditoronline.org/&quot;,&quot;_blank&quot;)" data-toggle="tooltip" data-placement="bottom" title="" data-original-title="https://jsoneditoronline.org/"><div class="xe-comment-entry"> <a class="xe-user-img"><img data-src="https://ae01.alicdn.com/kf/Hac93258007754340927a1e0712c760ddf.png" class="lozad img-circle" width="40" src="https://ae01.alicdn.com/kf/Hac93258007754340927a1e0712c760ddf.png" data-loaded="true"></a><div class="xe-comment"> <a href="#" class="xe-user-name overflowClip_1"><strong>Json Editor Online</strong></a><p class="overflowClip_2">在线编写JSON</p></div></div></div></div><div class="col-sm-3"><div class="xe-widget xe-conversations box2 label-info" onclick="window.open(&quot;https://latex.91maths.com/&quot;,&quot;_blank&quot;)" data-toggle="tooltip" data-placement="bottom" title="" data-original-title="https://latex.91maths.com/"><div class="xe-comment-entry"> <a class="xe-user-img"><img data-src="https://ae02.alicdn.com/kf/U9105c3efda2448cf964befd3d4e9d25fO.jpg" class="lozad img-circle" width="40" src="https://ae02.alicdn.com/kf/U9105c3efda2448cf964befd3d4e9d25fO.jpg" data-loaded="true"></a><div class="xe-comment"> <a href="#" class="xe-user-name overflowClip_1"><strong>LaTeX在线：吴文中数学公式编辑器</strong></a><p class="overflowClip_2">LaTeX在线：吴文中数学公式编辑器</p></div></div></div></div><div class="col-sm-3"><div class="xe-widget xe-conversations box2 label-info" onclick="window.open(&quot;http://md.aclickall.com/&quot;,&quot;_blank&quot;)" data-toggle="tooltip" data-placement="bottom" title="" data-original-title="http://md.aclickall.com/"><div class="xe-comment-entry"> <a class="xe-user-img"><img data-src="https://ae01.alicdn.com/kf/Hd20e3d0a02ee475784294994bbb21eca4.png" class="lozad img-circle" width="40" src="https://ae01.alicdn.com/kf/Hd20e3d0a02ee475784294994bbb21eca4.png" data-loaded="true"></a><div class="xe-comment"> <a href="#" class="xe-user-name overflowClip_1"><strong>在线Markdown</strong></a><p class="overflowClip_2">Markdown排版利器，还能让Markdown内容，无需作任何调整就能同时在微信公众号、博客园、掘金、csdn等平台正确显示当前预览的效果</p></div></div></div></div><div class="col-sm-3"><div class="xe-widget xe-conversations box2 label-info" onclick="window.open(&quot;https://mdnice.com/&quot;,&quot;_blank&quot;)" data-toggle="tooltip" data-placement="bottom" title="" data-original-title="https://mdnice.com/"><div class="xe-comment-entry"> <a class="xe-user-img"><img data-src="https://ae01.alicdn.com/kf/H941d45ba0b9e4b1b9836e58247250047E.png" class="lozad img-circle" width="40" src="https://ae01.alicdn.com/kf/H941d45ba0b9e4b1b9836e58247250047E.png" data-loaded="true"></a><div class="xe-comment"> <a href="#" class="xe-user-name overflowClip_1"><strong>让微信排版很nice</strong></a><p class="overflowClip_2">让微信排版很nice</p></div></div></div></div><div class="col-sm-3"><div class="xe-widget xe-conversations box2 label-info" onclick="window.open(&quot;https://app.diagrams.net/&quot;,&quot;_blank&quot;)" data-toggle="tooltip" data-placement="bottom" title="" data-original-title="https://app.diagrams.net/"><div class="xe-comment-entry"> <a class="xe-user-img"><img data-src="https://ae01.alicdn.com/kf/Hff2bd89b9f4f4bb0a9ad966968a41c8cZ.png" class="lozad img-circle" width="40" src="https://ae01.alicdn.com/kf/Hff2bd89b9f4f4bb0a9ad966968a41c8cZ.png" data-loaded="true"></a><div class="xe-comment"> <a href="#" class="xe-user-name overflowClip_1"><strong>在线绘图</strong></a><p class="overflowClip_2">diagrams.net is a free online diagramming application and flowchart maker</p></div></div></div></div><div class="col-sm-3"><div class="xe-widget xe-conversations box2 label-info" onclick="window.open(&quot;https://gitmind.cn/app/my&quot;,&quot;_blank&quot;)" data-toggle="tooltip" data-placement="bottom" title="" data-original-title="https://gitmind.cn/app/my"><div class="xe-comment-entry"> <a class="xe-user-img"><img data-src="https://ae01.alicdn.com/kf/H3fdfe57175db452da1ef2221ab00c77ez.png" class="lozad img-circle" width="40" src="https://ae01.alicdn.com/kf/H3fdfe57175db452da1ef2221ab00c77ez.png" data-loaded="true"></a><div class="xe-comment"> <a href="#" class="xe-user-name overflowClip_1"><strong>GitMind</strong></a><p class="overflowClip_2">GitMind是一款免费在线思维导图软件，支持Windows/Mac/Linux多平台操作及内容同步。图片、链接、备注等实用工具，让你的思维导图更加生动</p></div></div></div></div><div class="col-sm-3"><div class="xe-widget xe-conversations box2 label-info" onclick="window.open(&quot;https://carbon.now.sh/&quot;,&quot;_blank&quot;)" data-toggle="tooltip" data-placement="bottom" title="" data-original-title="https://carbon.now.sh/"><div class="xe-comment-entry"> <a class="xe-user-img"><img data-src="https://ae01.alicdn.com/kf/Hb1c8a09d5dc34d9298dc3e13853b3ed0P.png" class="lozad img-circle" width="40" src="https://ae01.alicdn.com/kf/Hb1c8a09d5dc34d9298dc3e13853b3ed0P.png" data-loaded="true"></a><div class="xe-comment"> <a href="#" class="xe-user-name overflowClip_1"><strong>Mac代码块</strong></a><p class="overflowClip_2">快速生成MAC样式的代码块。</p></div></div></div></div><div class="col-sm-3"><div class="xe-widget xe-conversations box2 label-info" onclick="window.open(&quot;http://s.zcjun.com/&quot;,&quot;_blank&quot;)" data-toggle="tooltip" data-placement="bottom" title="" data-original-title="http://s.zcjun.com/"><div class="xe-comment-entry"> <a class="xe-user-img"><img data-src="https://ae01.alicdn.com/kf/Hc23a4ccd5cb44361b85d69bcdea4ab73D.png" class="lozad img-circle" width="40" src="https://ae01.alicdn.com/kf/Hc23a4ccd5cb44361b85d69bcdea4ab73D.png" data-loaded="true"></a><div class="xe-comment"> <a href="#" class="xe-user-name overflowClip_1"><strong>网站缩略图</strong></a><p class="overflowClip_2">网站缩略图生成</p></div></div></div></div></div>
            <br>
            <h4 class="text-gray"><i class="linecons-tag" style="margin-right:7px" id="文件处理"></i>文件处理</h4>
            <div class="row"><div class="col-sm-3"><div class="xe-widget xe-conversations box2 label-info" onclick="window.open(&quot;https://docsmall.com/&quot;,&quot;_blank&quot;)" data-toggle="tooltip" data-placement="bottom" title="" data-original-title="https://docsmall.com/"><div class="xe-comment-entry"> <a class="xe-user-img"><img data-src="https://ae02.alicdn.com/kf/Ue573a7cd3c5e45c1bd673e392625d734t.jpg" class="lozad img-circle" width="40" src="https://ae02.alicdn.com/kf/Ue573a7cd3c5e45c1bd673e392625d734t.jpg" data-loaded="true"></a><div class="xe-comment"> <a href="#" class="xe-user-name overflowClip_1"><strong>docsmall</strong></a><p class="overflowClip_2">免费在线图片压缩、GIF压缩工具、PDF压缩工具、PDF合并工具、PDF分割工具</p></div></div></div></div><div class="col-sm-3"><div class="xe-widget xe-conversations box2 label-info" onclick="window.open(&quot;https://html2pug.now.sh/&quot;,&quot;_blank&quot;)" data-toggle="tooltip" data-placement="bottom" title="" data-original-title="https://html2pug.now.sh/"><div class="xe-comment-entry"> <a class="xe-user-img"><img data-src="https://cdn.jsdelivr.net/gh/blogimg/HexoStaticFile2@latest/2020/07/10/c72ced84b64377d9b709d98865fe7d2c.png" class="lozad img-circle" width="40" src="https://cdn.jsdelivr.net/gh/blogimg/HexoStaticFile2@latest/2020/07/10/c72ced84b64377d9b709d98865fe7d2c.png" data-loaded="true"></a><div class="xe-comment"> <a href="#" class="xe-user-name overflowClip_1"><strong>HTML转PUG</strong></a><p class="overflowClip_2">Pug 是一款健壮、灵活、功能丰富的模板引擎，专门为 Node.js 平台开发。Pug 是由 Jade 改名而来。</p></div></div></div></div><div class="col-sm-3"><div class="xe-widget xe-conversations box2 label-info" onclick="window.open(&quot;http://css2sass.herokuapp.com/&quot;,&quot;_blank&quot;)" data-toggle="tooltip" data-placement="bottom" title="" data-original-title="http://css2sass.herokuapp.com/"><div class="xe-comment-entry"> <a class="xe-user-img"><img data-src="http://css2sass.herokuapp.com/images/favicon.ico" class="lozad img-circle" width="40" src="http://css2sass.herokuapp.com/images/favicon.ico" data-loaded="true"></a><div class="xe-comment"> <a href="#" class="xe-user-name overflowClip_1"><strong>CSS转scss/sass</strong></a><p class="overflowClip_2">Convert CSS Snippets to Syntactically Awesome StyleSheets code</p></div></div></div></div><div class="col-sm-3"><div class="xe-widget xe-conversations box2 label-info" onclick="window.open(&quot;https://www.remove.bg/zh/upload&quot;,&quot;_blank&quot;)" data-toggle="tooltip" data-placement="bottom" title="" data-original-title="https://www.remove.bg/zh/upload"><div class="xe-comment-entry"> <a class="xe-user-img"><img data-src="https://ae02.alicdn.com/kf/Hfe7cd53344ad45ab826400e46d6879edd.jpg" class="lozad img-circle" width="40" src="https://ae02.alicdn.com/kf/Hfe7cd53344ad45ab826400e46d6879edd.jpg" data-loaded="true"></a><div class="xe-comment"> <a href="#" class="xe-user-name overflowClip_1"><strong>消除背景</strong></a><p class="overflowClip_2">选择一张图片并消除背景 - 100% 全自动 - 仅用 5 秒钟 - 无需点击 - 而且免费</p></div></div></div></div><div class="col-sm-3"><div class="xe-widget xe-conversations box2 label-info" onclick="window.open(&quot;https://www.tutieshi.com/compress/&quot;,&quot;_blank&quot;)" data-toggle="tooltip" data-placement="bottom" title="" data-original-title="https://www.tutieshi.com/compress/"><div class="xe-comment-entry"> <a class="xe-user-img"><img data-src="https://ae01.alicdn.com/kf/Had9d9087f6bb42278ccc0210e02e5af47.png" class="lozad img-circle" width="40" src="https://ae01.alicdn.com/kf/Had9d9087f6bb42278ccc0210e02e5af47.png" data-loaded="true"></a><div class="xe-comment"> <a href="#" class="xe-user-name overflowClip_1"><strong>图贴士压缩</strong></a><p class="overflowClip_2">可压缩GIF、PNG、JPG格式的图片</p></div></div></div></div><div class="col-sm-3"><div class="xe-widget xe-conversations box2 label-info" onclick="window.open(&quot;https://www.picdiet.com/zh-cn&quot;,&quot;_blank&quot;)" data-toggle="tooltip" data-placement="bottom" title="" data-original-title="https://www.picdiet.com/zh-cn"><div class="xe-comment-entry"> <a class="xe-user-img"><img data-src="https://ae01.alicdn.com/kf/Hdd10921408e245978f411f138a6acf5es.png" class="lozad img-circle" width="40" src="https://ae01.alicdn.com/kf/Hdd10921408e245978f411f138a6acf5es.png" data-loaded="true"></a><div class="xe-comment"> <a href="#" class="xe-user-name overflowClip_1"><strong>picdiet</strong></a><p class="overflowClip_2">Picdiet是一款在线批量压缩图片神器，它不需要后端服务器或者API的支持，仅通过你的浏览器来压缩图片大小，这意味着它压缩图片极快并且不会导致隐私或敏感图片泄漏。同时我们大量的测试结果也证明其压缩表现要远好于常规的压缩软件如：jpegoptim，jpegtran，jpegrescan和jpegmini</p></div></div></div></div><div class="col-sm-3"><div class="xe-widget xe-conversations box2 label-info" onclick="window.open(&quot;https://tinypng.com/&quot;,&quot;_blank&quot;)" data-toggle="tooltip" data-placement="bottom" title="" data-original-title="https://tinypng.com/"><div class="xe-comment-entry"> <a class="xe-user-img"><img data-src="https://cdn.jsdelivr.net/gh/sviptzk/HexoStaticFile@master/webstack/assets/images/logos/tinypng.png" class="lozad img-circle" width="40" src="https://cdn.jsdelivr.net/gh/sviptzk/HexoStaticFile@master/webstack/assets/images/logos/tinypng.png" data-loaded="true"></a><div class="xe-comment"> <a href="#" class="xe-user-name overflowClip_1"><strong>tinypng</strong></a><p class="overflowClip_2">Optimize your images with a perfect balance in quality and file size.</p></div></div></div></div><div class="col-sm-3"><div class="xe-widget xe-conversations box2 label-info" onclick="window.open(&quot;https://zh.recompressor.com/&quot;,&quot;_blank&quot;)" data-toggle="tooltip" data-placement="bottom" title="" data-original-title="https://zh.recompressor.com/"><div class="xe-comment-entry"> <a class="xe-user-img"><img data-src="https://ae01.alicdn.com/kf/Hd82702f0b80e4f3d88b321f27d14f362o.png" class="lozad img-circle" width="40" src="https://ae01.alicdn.com/kf/Hd82702f0b80e4f3d88b321f27d14f362o.png" data-loaded="true"></a><div class="xe-comment"> <a href="#" class="xe-user-name overflowClip_1"><strong>最优图片优化</strong></a><p class="overflowClip_2">可以压缩JPG与PNG、SVG</p></div></div></div></div><div class="col-sm-3"><div class="xe-widget xe-conversations box2 label-info" onclick="window.open(&quot;https://squoosh.app/&quot;,&quot;_blank&quot;)" data-toggle="tooltip" data-placement="bottom" title="" data-original-title="https://squoosh.app/"><div class="xe-comment-entry"> <a class="xe-user-img"><img data-src="https://ae01.alicdn.com/kf/H6aa479b05fbc4b56838a7b11af2930f6e.png" class="lozad img-circle" width="40" src="https://ae01.alicdn.com/kf/H6aa479b05fbc4b56838a7b11af2930f6e.png" data-loaded="true"></a><div class="xe-comment"> <a href="#" class="xe-user-name overflowClip_1"><strong>squoosh</strong></a><p class="overflowClip_2">Compress and compare images with different codecs, right in your browser</p></div></div></div></div><div class="col-sm-3"><div class="xe-widget xe-conversations box2 label-info" onclick="window.open(&quot;https://www.gaoding.com&quot;,&quot;_blank&quot;)" data-toggle="tooltip" data-placement="bottom" title="" data-original-title="https://www.gaoding.com"><div class="xe-comment-entry"> <a class="xe-user-img"><img data-src="https://cdn.jsdelivr.net/gh/sviptzk/HexoStaticFile@master/webstack/assets/images/logos/gaoding.png" class="lozad img-circle" width="40" src="https://cdn.jsdelivr.net/gh/sviptzk/HexoStaticFile@master/webstack/assets/images/logos/gaoding.png" data-loaded="true"></a><div class="xe-comment"> <a href="#" class="xe-user-name overflowClip_1"><strong>稿定抠图</strong></a><p class="overflowClip_2">免费在线抠图软件,图片快速换背景-抠白底图</p></div></div></div></div><div class="col-sm-3"><div class="xe-widget xe-conversations box2 label-info" onclick="window.open(&quot;https://en.m.fontke.com/tool/subfont/&quot;,&quot;_blank&quot;)" data-toggle="tooltip" data-placement="bottom" title="" data-original-title="https://en.m.fontke.com/tool/subfont/"><div class="xe-comment-entry"> <a class="xe-user-img"><img data-src="https://cdn.jsdelivr.net/gh/blogimg/HexoStaticFile2@latest/2020/08/05/b69d18f0cad47fad5fd7e9447d9a5069.png" class="lozad img-circle" width="40" src="https://cdn.jsdelivr.net/gh/blogimg/HexoStaticFile2@latest/2020/08/05/b69d18f0cad47fad5fd7e9447d9a5069.png" data-loaded="true"></a><div class="xe-comment"> <a href="#" class="xe-user-name overflowClip_1"><strong>字体子集生成器</strong></a><p class="overflowClip_2">字客网字体子集生成器可以让用户抽出一个字体文件里想要的字，再组成精减的字体文件，十分适合制作网页字体。操作简单，快捷，只需输入想要抽取的字，之后一键生成。</p></div></div></div></div><div class="col-sm-3"><div class="xe-widget xe-conversations box2 label-info" onclick="window.open(&quot;https://en.m.fontke.com/tool/subfont/&quot;,&quot;_blank&quot;)" data-toggle="tooltip" data-placement="bottom" title="" data-original-title="https://en.m.fontke.com/tool/subfont/"><div class="xe-comment-entry"> <a class="xe-user-img"><img data-src="https://cdn.jsdelivr.net/gh/blogimg/HexoStaticFile2@latest/2020/08/05/8c045fbabfb40f3ea65242502ce43de1.png" class="lozad img-circle" width="40" src="https://cdn.jsdelivr.net/gh/blogimg/HexoStaticFile2@latest/2020/08/05/8c045fbabfb40f3ea65242502ce43de1.png" data-loaded="true"></a><div class="xe-comment"> <a href="#" class="xe-user-name overflowClip_1"><strong>字体子集生成器</strong></a><p class="overflowClip_2">使用此免费在线SVG 至PNG转换软件允许您将SVG文档转换成PNG文档，轻松且简单，无需安装任何软件。</p></div></div></div></div></div>
            <br>

            <h4 class="text-gray"><i class="linecons-tag" style="margin-right:7px" id="图片素材"></i>图片素材</h4>
            <div class="row"><div class="col-sm-3"><div class="xe-widget xe-conversations box2 label-info" onclick="window.open(&quot;http://www.iconfont.cn/&quot;,&quot;_blank&quot;)" data-toggle="tooltip" data-placement="bottom" title="" data-original-title="http://www.iconfont.cn/"><div class="xe-comment-entry"> <a class="xe-user-img"><img data-src="https://cdn.jsdelivr.net/gh/sviptzk/HexoStaticFile@master/webstack/assets/images/logos/iconfont.png" class="lozad img-circle" width="40" src="https://cdn.jsdelivr.net/gh/sviptzk/HexoStaticFile@master/webstack/assets/images/logos/iconfont.png" data-loaded="true"></a><div class="xe-comment"> <a href="#" class="xe-user-name overflowClip_1"><strong>iconfont</strong></a><p class="overflowClip_2">阿里巴巴矢量图标库</p></div></div></div></div><div class="col-sm-3"><div class="xe-widget xe-conversations box2 label-info" onclick="window.open(&quot;https://dh.xiaokang.me/font5/&quot;,&quot;_blank&quot;)" data-toggle="tooltip" data-placement="bottom" title="" data-original-title="https://dh.xiaokang.me/font5/"><div class="xe-comment-entry"> <a class="xe-user-img"><img data-src="https://ae01.alicdn.com/kf/H139ad2194f9547d7b43005c8e18f048cR.png" class="lozad img-circle" width="40" src="https://ae01.alicdn.com/kf/H139ad2194f9547d7b43005c8e18f048cR.png" data-loaded="true"></a><div class="xe-comment"> <a href="#" class="xe-user-name overflowClip_1"><strong>小康的 Font Awesome 5 图标速查</strong></a><p class="overflowClip_2">简单快速的使用Font Awesome 5 图标</p></div></div></div></div><div class="col-sm-3"><div class="xe-widget xe-conversations box2 label-info" onclick="window.open(&quot;https://fa5.dashgame.com/#/%E5%9B%BE%E6%A0%87&quot;,&quot;_blank&quot;)" data-toggle="tooltip" data-placement="bottom" title="" data-original-title="https://fa5.dashgame.com/#/%E5%9B%BE%E6%A0%87"><div class="xe-comment-entry"> <a class="xe-user-img"><img data-src="https://ae01.alicdn.com/kf/U2b267f8ebe6740f5aa0306f1375611a3B.jpg" class="lozad img-circle" width="40" src="https://ae01.alicdn.com/kf/U2b267f8ebe6740f5aa0306f1375611a3B.jpg" data-loaded="true"></a><div class="xe-comment"> <a href="#" class="xe-user-name overflowClip_1"><strong>Font Awesome 5 中文文档</strong></a><p class="overflowClip_2">Font Awesome 5 中文文档</p></div></div></div></div><div class="col-sm-3"><div class="xe-widget xe-conversations box2 label-info" onclick="window.open(&quot;https://fontawesome.com/icons?d=gallery&amp;g=hands&amp;m=free&quot;,&quot;_blank&quot;)" data-toggle="tooltip" data-placement="bottom" title="" data-original-title="https://fontawesome.com/icons?d=gallery&amp;g=hands&amp;m=free"><div class="xe-comment-entry"> <a class="xe-user-img"><img data-src="https://ae01.alicdn.com/kf/H139ad2194f9547d7b43005c8e18f048cR.png" class="lozad img-circle" width="40" src="https://ae01.alicdn.com/kf/H139ad2194f9547d7b43005c8e18f048cR.png" data-loaded="true"></a><div class="xe-comment"> <a href="#" class="xe-user-name overflowClip_1"><strong>Font Awesome5图标库</strong></a><p class="overflowClip_2">快速查询Font Awesome5的图标</p></div></div></div></div><div class="col-sm-3"><div class="xe-widget xe-conversations box2 label-info" onclick="window.open(&quot;https://remixicon.com/&quot;,&quot;_blank&quot;)" data-toggle="tooltip" data-placement="bottom" title="" data-original-title="https://remixicon.com/"><div class="xe-comment-entry"> <a class="xe-user-img"><img data-src="https://ae03.alicdn.com/kf/Hcd12c43a45e14e629c0d46f3e1ec6be8r.jpg" class="lozad img-circle" width="40" src="https://ae03.alicdn.com/kf/Hcd12c43a45e14e629c0d46f3e1ec6be8r.jpg" data-loaded="true"></a><div class="xe-comment"> <a href="#" class="xe-user-name overflowClip_1"><strong>REMIX ICON</strong></a><p class="overflowClip_2">Simply Delightful Icon System</p></div></div></div></div><div class="col-sm-3"><div class="xe-widget xe-conversations box2 label-info" onclick="window.open(&quot;http://www.easyicon.net/&quot;,&quot;_blank&quot;)" data-toggle="tooltip" data-placement="bottom" title="" data-original-title="http://www.easyicon.net/"><div class="xe-comment-entry"> <a class="xe-user-img"><img data-src="https://cdn.jsdelivr.net/gh/sviptzk/HexoStaticFile@master/webstack/assets/images/logos/easyicon.png" class="lozad img-circle" width="40" src="https://cdn.jsdelivr.net/gh/sviptzk/HexoStaticFile@master/webstack/assets/images/logos/easyicon.png" data-loaded="true"></a><div class="xe-comment"> <a href="#" class="xe-user-name overflowClip_1"><strong>easyicon</strong></a><p class="overflowClip_2">PNG、ICO、ICNS格式图标搜索、图标下载服务</p></div></div></div></div><div class="col-sm-3"><div class="xe-widget xe-conversations box2 label-info" onclick="window.open(&quot;https://pixivic.com/&quot;,&quot;_blank&quot;)" data-toggle="tooltip" data-placement="bottom" title="" data-original-title="https://pixivic.com/"><div class="xe-comment-entry"> <a class="xe-user-img"><img data-src="https://ae01.alicdn.com/kf/Hbd3f63cbdb504d288a5d6a6877eaa7ffa.png" class="lozad img-circle" width="40" src="https://ae01.alicdn.com/kf/Hbd3f63cbdb504d288a5d6a6877eaa7ffa.png" data-loaded="true"></a><div class="xe-comment"> <a href="#" class="xe-user-name overflowClip_1"><strong>Pixivic</strong></a><p class="overflowClip_2">提供Pixiv插画排行榜的浏览与下载以及热门排序的高级会员搜索</p></div></div></div></div><div class="col-sm-3"><div class="xe-widget xe-conversations box2 label-info" onclick="window.open(&quot;https://www.pixiv.net/&quot;,&quot;_blank&quot;)" data-toggle="tooltip" data-placement="bottom" title="" data-original-title="https://www.pixiv.net/"><div class="xe-comment-entry"> <a class="xe-user-img"><img data-src="https://ae01.alicdn.com/kf/Hbd44886d24af40c3ac19af6b373d37204.png" class="lozad img-circle" width="40" src="https://ae01.alicdn.com/kf/Hbd44886d24af40c3ac19af6b373d37204.png" data-loaded="true"></a><div class="xe-comment"> <a href="#" class="xe-user-name overflowClip_1"><strong>Pixiv</strong></a><p class="overflowClip_2">由日本艺术家所组成的虚拟社群</p></div></div></div></div><div class="col-sm-3"><div class="xe-widget xe-conversations box2 label-info" onclick="window.open(&quot;https://www.pinterest.com/&quot;,&quot;_blank&quot;)" data-toggle="tooltip" data-placement="bottom" title="" data-original-title="https://www.pinterest.com/"><div class="xe-comment-entry"> <a class="xe-user-img"><img data-src="https://ae01.alicdn.com/kf/H007c1d984d47401591376258699206a9j.png" class="lozad img-circle" width="40" src="https://ae01.alicdn.com/kf/H007c1d984d47401591376258699206a9j.png" data-loaded="true"></a><div class="xe-comment"> <a href="#" class="xe-user-name overflowClip_1"><strong>Pinterest</strong></a><p class="overflowClip_2">瀑布流的形式展现图片内容，无需用户翻页，新的图片不断自动加载在页面底端</p></div></div></div></div><div class="col-sm-3"><div class="xe-widget xe-conversations box2 label-info" onclick="window.open(&quot;https://wallhaven.cc/toplist?page=3&quot;,&quot;_blank&quot;)" data-toggle="tooltip" data-placement="bottom" title="" data-original-title="https://wallhaven.cc/toplist?page=3"><div class="xe-comment-entry"> <a class="xe-user-img"><img data-src="https://ae01.alicdn.com/kf/Hf887c2db312d40d1b5d27297a1edbeedu.png" class="lozad img-circle" width="40" src="https://ae01.alicdn.com/kf/Hf887c2db312d40d1b5d27297a1edbeedu.png" data-loaded="true"></a><div class="xe-comment"> <a href="#" class="xe-user-name overflowClip_1"><strong>wallhaven顶部图</strong></a><p class="overflowClip_2">Most popular uploaded Wallpapers</p></div></div></div></div><div class="col-sm-3"><div class="xe-widget xe-conversations box2 label-info" onclick="window.open(&quot;https://unsplash.com/&quot;,&quot;_blank&quot;)" data-toggle="tooltip" data-placement="bottom" title="" data-original-title="https://unsplash.com/"><div class="xe-comment-entry"> <a class="xe-user-img"><img data-src="https://ae01.alicdn.com/kf/H7a74de7359e04abf8d1f46cd1d1f4709E.png" class="lozad img-circle" width="40" src="https://ae01.alicdn.com/kf/H7a74de7359e04abf8d1f46cd1d1f4709E.png" data-loaded="true"></a><div class="xe-comment"> <a href="#" class="xe-user-name overflowClip_1"><strong>Unsplash</strong></a><p class="overflowClip_2">Beautiful, free images and photos that you can download and use for any project. Better than any royalty free or stock photos.</p></div></div></div></div><div class="col-sm-3"><div class="xe-widget xe-conversations box2 label-info" onclick="window.open(&quot;https://www.colorhub.me/&quot;,&quot;_blank&quot;)" data-toggle="tooltip" data-placement="bottom" title="" data-original-title="https://www.colorhub.me/"><div class="xe-comment-entry"> <a class="xe-user-img"><img data-src="https://ae01.alicdn.com/kf/H0d8df69ba23c4a2baac8b0fac568b33e6.png" class="lozad img-circle" width="40" src="https://ae01.alicdn.com/kf/H0d8df69ba23c4a2baac8b0fac568b33e6.png" data-loaded="true"></a><div class="xe-comment"> <a href="#" class="xe-user-name overflowClip_1"><strong>Colorhub</strong></a><p class="overflowClip_2">高清无版权图片，个人和商业用途免费</p></div></div></div></div><div class="col-sm-3"><div class="xe-widget xe-conversations box2 label-info" onclick="window.open(&quot;https://www.pexels.com/zh-cn/&quot;,&quot;_blank&quot;)" data-toggle="tooltip" data-placement="bottom" title="" data-original-title="https://www.pexels.com/zh-cn/"><div class="xe-comment-entry"> <a class="xe-user-img"><img data-src="https://ae01.alicdn.com/kf/H9a8321e954a74cd69b104685ae1eb185t.png" class="lozad img-circle" width="40" src="https://ae01.alicdn.com/kf/H9a8321e954a74cd69b104685ae1eb185t.png" data-loaded="true"></a><div class="xe-comment"> <a href="#" class="xe-user-name overflowClip_1"><strong>Pexels</strong></a><p class="overflowClip_2">免费素材照片，可以在任何地方使用。✓ 免费用于商业用途 ✓ 无需注明归属</p></div></div></div></div><div class="col-sm-3"><div class="xe-widget xe-conversations box2 label-info" onclick="window.open(&quot;https://pixabay.com/&quot;,&quot;_blank&quot;)" data-toggle="tooltip" data-placement="bottom" title="" data-original-title="https://pixabay.com/"><div class="xe-comment-entry"> <a class="xe-user-img"><img data-src="https://ae01.alicdn.com/kf/Hf57f57b587d44f3f97ad41ca64ef9617B.png" class="lozad img-circle" width="40" src="https://ae01.alicdn.com/kf/Hf57f57b587d44f3f97ad41ca64ef9617B.png" data-loaded="true"></a><div class="xe-comment"> <a href="#" class="xe-user-name overflowClip_1"><strong>Pixabay</strong></a><p class="overflowClip_2">Stunning free images &amp; royalty free stock</p></div></div></div></div><div class="col-sm-3"><div class="xe-widget xe-conversations box2 label-info" onclick="window.open(&quot;https://wallpaperhub.app/&quot;,&quot;_blank&quot;)" data-toggle="tooltip" data-placement="bottom" title="" data-original-title="https://wallpaperhub.app/"><div class="xe-comment-entry"> <a class="xe-user-img"><img data-src="https://ae01.alicdn.com/kf/He027a64143464cc6ae5dbfbc3f589b795.png" class="lozad img-circle" width="40" src="https://ae01.alicdn.com/kf/He027a64143464cc6ae5dbfbc3f589b795.png" data-loaded="true"></a><div class="xe-comment"> <a href="#" class="xe-user-name overflowClip_1"><strong>WallpaperHub</strong></a><p class="overflowClip_2">Download free wallpapers for your PC, phone and tablet.</p></div></div></div></div><div class="col-sm-3"><div class="xe-widget xe-conversations box2 label-info" onclick="window.open(&quot;https://www.behance.net/&quot;,&quot;_blank&quot;)" data-toggle="tooltip" data-placement="bottom" title="" data-original-title="https://www.behance.net/"><div class="xe-comment-entry"> <a class="xe-user-img"><img data-src="https://ae01.alicdn.com/kf/Hf346fa9eae04495ea907707c4e6ba130g.png" class="lozad img-circle" width="40" src="https://ae01.alicdn.com/kf/Hf346fa9eae04495ea907707c4e6ba130g.png" data-loaded="true"></a><div class="xe-comment"> <a href="#" class="xe-user-name overflowClip_1"><strong>Behance</strong></a><p class="overflowClip_2">Behance 作品精选</p></div></div></div></div><div class="col-sm-3"><div class="xe-widget xe-conversations box2 label-info" onclick="window.open(&quot;https://www.zcool.com.cn/&quot;,&quot;_blank&quot;)" data-toggle="tooltip" data-placement="bottom" title="" data-original-title="https://www.zcool.com.cn/"><div class="xe-comment-entry"> <a class="xe-user-img"><img data-src="https://ae01.alicdn.com/kf/H00876c41539945cdbf3ddef8e09450b9r.png" class="lozad img-circle" width="40" src="https://ae01.alicdn.com/kf/H00876c41539945cdbf3ddef8e09450b9r.png" data-loaded="true"></a><div class="xe-comment"> <a href="#" class="xe-user-name overflowClip_1"><strong>站酷 (ZCOOL)</strong></a><p class="overflowClip_2">站酷 (ZCOOL)，中国设计师互动平台。深耕设计领域十四年，站酷聚集了1100万设计师、摄影师、插画师、艺术家、创意人，设计创意群体中具有较高的影响力与号召力。</p></div></div></div></div><div class="col-sm-3"><div class="xe-widget xe-conversations box2 label-info" onclick="window.open(&quot;https://coolbackgrounds.io/&quot;,&quot;_blank&quot;)" data-toggle="tooltip" data-placement="bottom" title="" data-original-title="https://coolbackgrounds.io/"><div class="xe-comment-entry"> <a class="xe-user-img"><img data-src="https://cdn.jsdelivr.net/gh/blogimg/HexoStaticFile2@latest/2020/07/18/e16fe2c09d2be01b4b6d1a584f0110ad.png" class="lozad img-circle" width="40" src="https://cdn.jsdelivr.net/gh/blogimg/HexoStaticFile2@latest/2020/07/18/e16fe2c09d2be01b4b6d1a584f0110ad.png" data-loaded="true"></a><div class="xe-comment"> <a href="#" class="xe-user-name overflowClip_1"><strong>特效背景生成</strong></a><p class="overflowClip_2">Cool Backgrounds</p></div></div></div></div><div class="col-sm-3"><div class="xe-widget xe-conversations box2 label-info" onclick="window.open(&quot;https://neumorphism.io/&quot;,&quot;_blank&quot;)" data-toggle="tooltip" data-placement="bottom" title="" data-original-title="https://neumorphism.io/"><div class="xe-comment-entry"> <a class="xe-user-img"><img data-src="https://cdn.jsdelivr.net/gh/blogimg/HexoStaticFile2@latest/2020/07/18/4079717c93f498bd2098c03f8a966e39.png" class="lozad img-circle" width="40" src="https://cdn.jsdelivr.net/gh/blogimg/HexoStaticFile2@latest/2020/07/18/4079717c93f498bd2098c03f8a966e39.png" data-loaded="true"></a><div class="xe-comment"> <a href="#" class="xe-user-name overflowClip_1"><strong>拟物风格生成</strong></a><p class="overflowClip_2">Generate Soft-UI CSS code</p></div></div></div></div><div class="col-sm-3"><div class="xe-widget xe-conversations box2 label-info" onclick="window.open(&quot;https://backiee.com/&quot;,&quot;_blank&quot;)" data-toggle="tooltip" data-placement="bottom" title="" data-original-title="https://backiee.com/"><div class="xe-comment-entry"> <a class="xe-user-img"><img data-src="https://files.alexhchu.com/2020/08/18/293e8388a6a9a.png" class="lozad img-circle" width="40" src="https://files.alexhchu.com/2020/08/18/293e8388a6a9a.png" data-loaded="true"></a><div class="xe-comment"> <a href="#" class="xe-user-name overflowClip_1"><strong>Backiee</strong></a><p class="overflowClip_2">The ultimate free wallpaper site and app. Available on Web, iPhone, Android, Xbox, and Windows platform as well</p></div></div></div></div><div class="col-sm-3"><div class="xe-widget xe-conversations box2 label-info" onclick="window.open(&quot;http://desktop.hdwallps.com/&quot;,&quot;_blank&quot;)" data-toggle="tooltip" data-placement="bottom" title="" data-original-title="http://desktop.hdwallps.com/"><div class="xe-comment-entry"> <a class="xe-user-img"><img data-src="https://files.alexhchu.com/2020/08/18/280462535a19d.png" class="lozad img-circle" width="40"></a><div class="xe-comment"> <a href="#" class="xe-user-name overflowClip_1"><strong>Desktop Wallps</strong></a><p class="overflowClip_2">HD Wallpaper For Desktop Background</p></div></div></div></div><div class="col-sm-3"><div class="xe-widget xe-conversations box2 label-info" onclick="window.open(&quot;https://wallpaperaccess.com/&quot;,&quot;_blank&quot;)" data-toggle="tooltip" data-placement="bottom" title="" data-original-title="https://wallpaperaccess.com/"><div class="xe-comment-entry"> <a class="xe-user-img"><img data-src="https://files.alexhchu.com/2020/08/18/280462535a19d.png" class="lozad img-circle" width="40"></a><div class="xe-comment"> <a href="#" class="xe-user-name overflowClip_1"><strong>wallpaperaccess</strong></a><p class="overflowClip_2">Only the best wallpapers. Daily additions of new, awesome, HD wallpapers for desktop and phones.</p></div></div></div></div></div>
            <br>
            <h4 class="text-gray"><i class="linecons-tag" style="margin-right:7px" id="在线配色"></i>在线配色</h4>
            <div class="row"><div class="col-sm-3"><div class="xe-widget xe-conversations box2 label-info" onclick="window.open(&quot;http://www.peise.net/&quot;,&quot;_blank&quot;)" data-toggle="tooltip" data-placement="bottom" title="" data-original-title="http://www.peise.net/"><div class="xe-comment-entry"> <a class="xe-user-img"><img data-src="https://ae01.alicdn.com/kf/Hfd1b76bfbfa448eb84132a08feb75468Y.png" class="lozad img-circle" width="40" src="https://ae01.alicdn.com/kf/Hfd1b76bfbfa448eb84132a08feb75468Y.png" data-loaded="true"></a><div class="xe-comment"> <a href="#" class="xe-user-name overflowClip_1"><strong>peise</strong></a><p class="overflowClip_2">在线配色</p></div></div></div></div><div class="col-sm-3"><div class="xe-widget xe-conversations box2 label-info" onclick="window.open(&quot;https://webkul.github.io/coolhue/&quot;,&quot;_blank&quot;)" data-toggle="tooltip" data-placement="bottom" title="" data-original-title="https://webkul.github.io/coolhue/"><div class="xe-comment-entry"> <a class="xe-user-img"><img data-src="https://ae01.alicdn.com/kf/Hebaaa27db8974449ad28d818d5660fb15.png" class="lozad img-circle" width="40" src="https://ae01.alicdn.com/kf/Hebaaa27db8974449ad28d818d5660fb15.png" data-loaded="true"></a><div class="xe-comment"> <a href="#" class="xe-user-name overflowClip_1"><strong>webkul</strong></a><p class="overflowClip_2">Get coolest handpicked gradient colors collection palette for your next project, alternatively copy css or download as image too.</p></div></div></div></div><div class="col-sm-3"><div class="xe-widget xe-conversations box2 label-info" onclick="window.open(&quot;https://uigradients.com/&quot;,&quot;_blank&quot;)" data-toggle="tooltip" data-placement="bottom" title="" data-original-title="https://uigradients.com/"><div class="xe-comment-entry"> <a class="xe-user-img"><img data-src="https://ae01.alicdn.com/kf/H9231fd2d81e04b2a9e705e7261e5aeb5E.png" class="lozad img-circle" width="40" src="https://ae01.alicdn.com/kf/H9231fd2d81e04b2a9e705e7261e5aeb5E.png" data-loaded="true"></a><div class="xe-comment"> <a href="#" class="xe-user-name overflowClip_1"><strong>uigradients</strong></a><p class="overflowClip_2">uiGradients is a handpicked collection of beautiful color gradients for designers and developers.</p></div></div></div></div><div class="col-sm-3"><div class="xe-widget xe-conversations box2 label-info" onclick="window.open(&quot;https://color.adobe.com/&quot;,&quot;_blank&quot;)" data-toggle="tooltip" data-placement="bottom" title="" data-original-title="https://color.adobe.com/"><div class="xe-comment-entry"> <a class="xe-user-img"><img data-src="https://ae01.alicdn.com/kf/Hca2e611ffa2e413ba5d892dc2404ad0a4.png" class="lozad img-circle" width="40" src="https://ae01.alicdn.com/kf/Hca2e611ffa2e413ba5d892dc2404ad0a4.png" data-loaded="true"></a><div class="xe-comment"> <a href="#" class="xe-user-name overflowClip_1"><strong>adobe color</strong></a><p class="overflowClip_2">Adobe家的配色</p></div></div></div></div></div>
            <br>

            <h4 class="text-gray"><i class="linecons-tag" style="margin-right:7px" id="API接口"></i>API接口</h4>
            <div class="row"><div class="col-sm-3"><div class="xe-widget xe-conversations box2 label-info" onclick="window.open(&quot;https://api.abcyun.co/&quot;,&quot;_blank&quot;)" data-toggle="tooltip" data-placement="bottom" title="" data-original-title="https://api.abcyun.co/"><div class="xe-comment-entry"> <a class="xe-user-img"><img data-src="https://ae01.alicdn.com/kf/Hc86a829fd96b43999987ad84ce4aca56N.png" class="lozad img-circle" width="40" src="https://ae01.alicdn.com/kf/Hc86a829fd96b43999987ad84ce4aca56N.png" data-loaded="true"></a><div class="xe-comment"> <a href="#" class="xe-user-name overflowClip_1"><strong>Hidove API</strong></a><p class="overflowClip_2">Hidove Api，提供简洁、稳定、易用的Api接口。</p></div></div></div></div><div class="col-sm-3"><div class="xe-widget xe-conversations box2 label-info" onclick="window.open(&quot;http://api.btstu.cn/&quot;,&quot;_blank&quot;)" data-toggle="tooltip" data-placement="bottom" title="" data-original-title="http://api.btstu.cn/"><div class="xe-comment-entry"> <a class="xe-user-img"><img data-src="https://ae01.alicdn.com/kf/Hd8c81d03e2cb409f83aa2c940c99c678c.png" class="lozad img-circle" width="40" src="https://ae01.alicdn.com/kf/Hd8c81d03e2cb409f83aa2c940c99c678c.png" data-loaded="true"></a><div class="xe-comment"> <a href="#" class="xe-user-name overflowClip_1"><strong>博天API</strong></a><p class="overflowClip_2">高速稳定免费APi接口调用平台</p></div></div></div></div><div class="col-sm-3"><div class="xe-widget xe-conversations box2 label-info" onclick="window.open(&quot;https://www.alapi.net/&quot;,&quot;_blank&quot;)" data-toggle="tooltip" data-placement="bottom" title="" data-original-title="https://www.alapi.net/"><div class="xe-comment-entry"> <a class="xe-user-img"><img data-src="https://ae01.alicdn.com/kf/Hd8c81d03e2cb409f83aa2c940c99c678c.png" class="lozad img-circle" width="40" src="https://ae01.alicdn.com/kf/Hd8c81d03e2cb409f83aa2c940c99c678c.png" data-loaded="true"></a><div class="xe-comment"> <a href="#" class="xe-user-name overflowClip_1"><strong>alapi</strong></a><p class="overflowClip_2">ALAPI,免费API服务,支持短网址缩短,快递查询,天气接口,翻译接口,网易云接口等...</p></div></div></div></div></div>
            <br>
         
            <h4 class="text-gray"><i class="linecons-tag" style="margin-right:7px" id="设计素材"></i>设计素材</h4>
            <div class="row">
                <div class="col-sm-3">
                    <div class="xe-widget xe-conversations box2 label-info"
                        onclick='window.open("https://www.iconfont.cn/","_blank")' data-toggle="tooltip"
                        data-placement="bottom" data-original-title="www.iconfont.cn">
                        <div class="xe-comment-entry"><a class="xe-user-img"><img
                                    src="https://cdn.jsdelivr.net/gh/Yafine/cdn@3.2.1/source/box/images/logo/iconfont.png"
                                    class="img-circle" width="40"></a>
                            <div class="xe-comment"><a href="#"
                                    class="xe-user-name overflowClip_1"><strong>Iconfont</strong></a>
                                <p class="overflowClip_2">阿里巴巴矢量图标库，提供矢量图标下载、在线存储、格式转换等功能</p>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="col-sm-3">
                    <div class="xe-widget xe-conversations box2 label-info"
                        onclick='window.open("https://fontawesome.com/","_blank")' data-toggle="tooltip"
                        data-placement="bottom" data-original-title="fontawesome.com">
                        <div class="xe-comment-entry"><a class="xe-user-img"><img
                                    src="https://cdn.jsdelivr.net/gh/Yafine/cdn@3.2.1/source/box/images/logo/fontawesome.png"
                                    class="img-circle" width="40"></a>
                            <div class="xe-comment"><a href="#" class="xe-user-name overflowClip_1"><strong>Font
                                        Awesome</strong></a>
                                <p class="overflowClip_2">一个基于CSS 和 LESS 的字体和图标工具包</p>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="col-sm-3">
                    <div class="xe-widget xe-conversations box2 label-info"
                        onclick='window.open("https://www.flaticon.com/","_blank")' data-toggle="tooltip"
                        data-placement="bottom" data-original-title="www.flaticon.com">
                        <div class="xe-comment-entry"><a class="xe-user-img"><img
                                    src="https://cdn.jsdelivr.net/gh/Yafine/cdn@3.2.1/source/box/images/logo/flaticon.png"
                                    class="img-circle" width="40"></a>
                            <div class="xe-comment"><a href="#"
                                    class="xe-user-name overflowClip_1"><strong>Flaticon</strong></a>
                                <p class="overflowClip_2">海量扁平化免费的图标库</p>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="col-sm-3">
                    <div class="xe-widget xe-conversations box2 label-info"
                        onclick='window.open("https://icons8.com/","_blank")' data-toggle="tooltip"
                        data-placement="bottom" data-original-title="icons8.com">
                        <div class="xe-comment-entry"><a class="xe-user-img"><img
                                    src="https://cdn.jsdelivr.net/gh/Yafine/cdn@3.2.1/source/box/images/logo/icons8.png"
                                    class="img-circle" width="40"></a>
                            <div class="xe-comment"><a href="#"
                                    class="xe-user-name overflowClip_1"><strong>icons8</strong></a>
                                <p class="overflowClip_2">独特系统平台风格和web图标库，下载免费图标，音乐</p>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="row">
                <div class="col-sm-3">
                    <div class="xe-widget xe-conversations box2 label-info"
                        onclick='window.open("https://www.58pic.com/","_blank")' data-toggle="tooltip"
                        data-placement="bottom" data-original-title="www.58pic.com">
                        <div class="xe-comment-entry"><a class="xe-user-img"><img
                                    src="https://cdn.jsdelivr.net/gh/Yafine/cdn@3.2.1/source/box/images/logo/58pic.png"
                                    class="img-circle" width="40"></a>
                            <div class="xe-comment"><a href="#"
                                    class="xe-user-name overflowClip_1"><strong>千图网</strong></a>
                                <p class="overflowClip_2">海量原创设计模板免费下载</p>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="col-sm-3">
                    <div class="xe-widget xe-conversations box2 label-info"
                        onclick='window.open("http://www.nipic.com/","_blank")' data-toggle="tooltip"
                        data-placement="bottom" data-original-title="www.nipic.com">
                        <div class="xe-comment-entry"><a class="xe-user-img"><img
                                    src="https://cdn.jsdelivr.net/gh/Yafine/cdn@3.2.1/source/box/images/logo/nipic.png"
                                    class="img-circle" width="40"></a>
                            <div class="xe-comment"><a href="#"
                                    class="xe-user-name overflowClip_1"><strong>昵图网</strong></a>
                                <p class="overflowClip_2">国内海量平面免费素材下载</p>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="col-sm-3">
                    <div class="xe-widget xe-conversations box2 label-info"
                        onclick='window.open("https://588ku.com/","_blank")' data-toggle="tooltip"
                        data-placement="bottom" data-original-title="588ku.com">
                        <div class="xe-comment-entry"><a class="xe-user-img"><img
                                    src="https://cdn.jsdelivr.net/gh/Yafine/cdn@3.2.1/source/box/images/logo/588ku.png"
                                    class="img-circle" width="40"></a>
                            <div class="xe-comment"><a href="#"
                                    class="xe-user-name overflowClip_1"><strong>千库网</strong></a>
                                <p class="overflowClip_2">免费 png 图片背景素材下载</p>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="col-sm-3">
                    <div class="xe-widget xe-conversations box2 label-info"
                        onclick='window.open("https://www.pexels.com/","_blank")' data-toggle="tooltip"
                        data-placement="bottom" data-original-title="www.pexels.com">
                        <div class="xe-comment-entry"><a class="xe-user-img"><img
                                    src="https://cdn.jsdelivr.net/gh/Yafine/cdn@3.2.1/source/box/images/logo/pexels.png"
                                    class="img-circle" width="40"></a>
                            <div class="xe-comment"><a href="#"
                                    class="xe-user-name overflowClip_1"><strong>Pexels</strong></a>
                                <p class="overflowClip_2">才华横溢的摄影作者在这里免费分享最精彩的素材照片和视频</p>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="row">
                <div class="col-sm-3">
                    <div class="xe-widget xe-conversations box2 label-info"
                        onclick='window.open("https://bing.ioliu.cn/","_blank")' data-toggle="tooltip"
                        data-placement="bottom" data-original-title="bing.ioliu.cn">
                        <div class="xe-comment-entry"><a class="xe-user-img"><img
                                    src="https://cdn.jsdelivr.net/gh/Yafine/cdn@3.2.1/source/box/images/logo/bing.png"
                                    class="img-circle" width="40"></a>
                            <div class="xe-comment"><a href="#"
                                    class="xe-user-name overflowClip_1"><strong>必应壁纸</strong></a>
                                <p class="overflowClip_2">必应每日高清壁纸</p>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="col-sm-3">
                    <div class="xe-widget xe-conversations box2 label-info"
                        onclick='window.open("https://www.piqsels.com/","_blank")' data-toggle="tooltip"
                        data-placement="bottom" data-original-title="www.piqsels.com">
                        <div class="xe-comment-entry"><a class="xe-user-img"><img
                                    src="https://cdn.jsdelivr.net/gh/Yafine/cdn@3.2.1/source/box/images/logo/piqsels.png"
                                    class="img-circle" width="40"></a>
                            <div class="xe-comment"><a href="#"
                                    class="xe-user-name overflowClip_1"><strong>Piqsels</strong></a>
                                <p class="overflowClip_2">精美的免版税图库</p>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="col-sm-3">
                    <div class="xe-widget xe-conversations box2 label-info"
                        onclick='window.open("http://sicangziti.com/","_blank")' data-toggle="tooltip"
                        data-placement="bottom" data-original-title="sicangziti.com">
                        <div class="xe-comment-entry"><a class="xe-user-img"><img
                                    src="https://cdn.jsdelivr.net/gh/Yafine/cdn@3.2.1/source/box/images/logo/sicangziti.png"
                                    class="img-circle" width="40"></a>
                            <div class="xe-comment"><a href="#"
                                    class="xe-user-name overflowClip_1"><strong>私藏字体</strong></a>
                                <p class="overflowClip_2">优质字体免费下载站</p>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="col-sm-3">
                    <div class="xe-widget xe-conversations box2 label-info"
                        onclick='window.open("http://www.1ppt.com/","_blank")' data-toggle="tooltip"
                        data-placement="bottom" data-original-title="www.1ppt.com">
                        <div class="xe-comment-entry"><a class="xe-user-img"><img
                                    src="https://cdn.jsdelivr.net/gh/Yafine/cdn@3.2.1/source/box/images/logo/1ppt.png"
                                    class="img-circle" width="40"></a>
                            <div class="xe-comment"><a href="#" class="xe-user-name overflowClip_1"><strong>第一 PPT
                                        网</strong></a>
                                <p class="overflowClip_2">免费 PPT 模板下载</p>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="row">
                <div class="col-sm-3">
                    <div class="xe-widget xe-conversations box2 label-info"
                        onclick='window.open("https://www.woodo.cn/","_blank")' data-toggle="tooltip"
                        data-placement="bottom" data-original-title="www.woodo.cn">
                        <div class="xe-comment-entry"><a class="xe-user-img"><img
                                    src="https://cdn.jsdelivr.net/gh/Yafine/cdn@3.2.1/source/box/images/logo/woodo.png"
                                    class="img-circle" width="40"></a>
                            <div class="xe-comment"><a href="#"
                                    class="xe-user-name overflowClip_1"><strong>吾道幻灯片</strong></a>
                                <p class="overflowClip_2">全新的office生产力工具，支持演示文稿、PPT模板、协同办公，可以帮助用户轻松创建具有视觉吸引力的幻灯片</p>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="col-sm-3">
                    <div class="xe-widget xe-conversations box2 label-info"
                        onclick='window.open("https://mixkit.co/","_blank")' data-toggle="tooltip"
                        data-placement="bottom" data-original-title="mixkit.co">
                        <div class="xe-comment-entry"><a class="xe-user-img"><img
                                    src="https://cdn.jsdelivr.net/gh/Yafine/cdn@3.2.1/source/box/images/logo/mixkit.png"
                                    class="img-circle" width="40"></a>
                            <div class="xe-comment"><a href="#"
                                    class="xe-user-name overflowClip_1"><strong>Mixkit</strong></a>
                                <p class="overflowClip_2">免费、高质量、可商用的视频素材分享网站</p>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="col-sm-3">
                    <div class="xe-widget xe-conversations box2 label-info"
                        onclick='window.open("http://thestocks.im/","_blank")' data-toggle="tooltip"
                        data-placement="bottom" data-original-title="thestocks.im">
                        <div class="xe-comment-entry"><a class="xe-user-img"><img
                                    src="https://cdn.jsdelivr.net/gh/Yafine/cdn@3.2.1/source/box/images/logo/thestocks.png"
                                    class="img-circle" width="40"></a>
                            <div class="xe-comment"><a href="#" class="xe-user-name overflowClip_1"><strong>The
                                        Stocks</strong></a>
                                <p class="overflowClip_2">对各大图片网站进行整合，免费优质图片下载</p>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="col-sm-3">
                    <div class="xe-widget xe-conversations box2 label-info"
                        onclick='window.open("https://bz.zzzmh.cn/","_blank")' data-toggle="tooltip"
                        data-placement="bottom" data-original-title="bz.zzzmh.cn">
                        <div class="xe-comment-entry"><a class="xe-user-img"><img
                                    src="https://cdn.jsdelivr.net/gh/Yafine/cdn@3.2.1/source/box/images/logo/zzzmh.png"
                                    class="img-circle" width="40"></a>
                            <div class="xe-comment"><a href="#"
                                    class="xe-user-name overflowClip_1"><strong>极简壁纸</strong></a>
                                <p class="overflowClip_2">高质量精品壁纸网站</p>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="row">
                <div class="col-sm-3">
                    <div class="xe-widget xe-conversations box2 label-info"
                        onclick='window.open("https://images.nasa.gov/","_blank")' data-toggle="tooltip"
                        data-placement="bottom" data-original-title="images.nasa.gov">
                        <div class="xe-comment-entry"><a class="xe-user-img"><img
                                    src="https://cdn.jsdelivr.net/gh/Yafine/cdn@3.2.1/source/box/images/logo/nasa.png"
                                    class="img-circle" width="40"></a>
                            <div class="xe-comment"><a href="#" class="xe-user-name overflowClip_1"><strong>NASA Image
                                        and Video Library</strong></a>
                                <p class="overflowClip_2">美国国家航天局的官方库，从此太空类的素材再也不是问题</p>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="col-sm-3">
                    <div class="xe-widget xe-conversations box2 label-info"
                        onclick='window.open("https://unsplash.com/","_blank")' data-toggle="tooltip"
                        data-placement="bottom" data-original-title="unsplash.com">
                        <div class="xe-comment-entry"><a class="xe-user-img"><img
                                    src="https://cdn.jsdelivr.net/gh/Yafine/cdn@3.2.1/source/box/images/logo/unsplash.png"
                                    class="img-circle" width="40"></a>
                            <div class="xe-comment"><a href="#"
                                    class="xe-user-name overflowClip_1"><strong>Unsplash</strong></a>
                                <p class="overflowClip_2">质量超高的免费图片素材库，无需注册，直接下载</p>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="col-sm-3">
                    <div class="xe-widget xe-conversations box2 label-info"
                        onclick='window.open("https://wordart.com/","_blank")' data-toggle="tooltip"
                        data-placement="bottom" data-original-title="wordart.com">
                        <div class="xe-comment-entry"><a class="xe-user-img"><img
                                    src="https://cdn.jsdelivr.net/gh/Yafine/cdn@3.2.1/source/box/images/logo/wordart.png"
                                    class="img-circle" width="40"></a>
                            <div class="xe-comment"><a href="#"
                                    class="xe-user-name overflowClip_1"><strong>WordArt</strong></a>
                                <p class="overflowClip_2">文字云工具</p>
                            </div>
                        </div>
                    </div>
                </div>
            </div><br>
          
 <h4 class="text-gray"><i class="linecons-tag" style="margin-right:7px" id="我的站点"></i>我的站点</h4>
 <div class="row">
    <div class="col-sm-3">
        <div class="xe-widget xe-conversations box2 label-info" onclick="window.open(&quot;https://blog.csdn.net/weixin_42529972&quot;,&quot;_blank&quot;)" data-toggle="tooltip" data-placement="bottom" title="" data-original-title="https://blog.csdn.net/weixin_42529972"><div class="xe-comment-entry">
             <a class="xe-user-img">
                 <img data-src="https://avatar.csdnimg.cn/8/A/E/3_weixin_42529972.jpg" class="lozad img-circle" width="40" src="https://avatar.csdnimg.cn/8/A/E/3_weixin_42529972.jpg" data-loaded="true"></a>
                 <div class="xe-comment"> 
                     <a target="_blank" rel="noopener" href="https://blog.csdn.net/lsxa123" class="xe-user-name overflowClip_1">
                         <strong>CSDN-lsxa123</strong></a>
                         <p class="overflowClip_2">CSDN博客</p>
                    </div>
                </div>
           </div>
   </div>
                     <div class="col-sm-3">
                         <div class="xe-widget xe-conversations box2 label-info" onclick="window.open(&quot;https://nekodeng.github.io/&quot;,&quot;_blank&quot;)" data-toggle="tooltip" data-placement="bottom" title="" data-original-title="https://linxuesong.github.io/"><div class="xe-comment-entry">
                              <a class="xe-user-img">
                                  <img data-src="/images/favicon.ico" class="lozad img-circle" width="40" src="/images/favicon.ico" data-loaded="true"></a>
                                  <div class="xe-comment"> 
                                      <a href="#" class="xe-user-name overflowClip_1">
                                          <strong>枫溪小窝</strong></a>
                                          <p class="overflowClip_2">博客站点</p>
                                     </div>
                                 </div>
                            </div>
                    </div>
                    
            </div>
                         
            <br>
            <h4 class="text-gray"><i class="linecons-tag" style="margin-right:7px" id="更多导航"></i>更多导航</h4>
            <p>未完待续...</p>
            <br>
        </div>
    </div>


    <script>
        $(document).ready(function () {
            return $(document).on("click", ".has-sub", function () {
                var e = $(this);
                $(this).hasClass("expanded") ? $(".has-sub ul").each(function (s, i) {
                    var t = $(this);
                    e.find("ul")[0] != i && setTimeout(function () {
                        t.attr("style", "")
                    }, 300)
                }) : setTimeout(function () {
                    e.find("ul").attr("style", "")
                }, 300)
            }), $(".user-info-menu .hidden-sm").click(function () {
                $(".sidebar-menu").hasClass("collapsed") ? $(".has-sub.expanded > ul").attr("style",
                    "") : $(".has-sub.expanded > ul").show()
            }), $("#main-menu li ul li").click(function () {
                $(this).siblings("li").removeClass("active"), $(this).addClass("active")
            }), $("a.smooth").click(function (s) {
                s.preventDefault(), public_vars.$mainMenu.add(public_vars.$sidebarProfile).toggleClass(
                    "mobile-is-visible"), ps_destroy(), $("html, body").animate({
                    scrollTop: $($(this).attr("href")).offset().top - 30
                }, {
                    duration: 500,
                    easing: "swing"
                })
            }), !1
        });
        var href = "",
            pos = 0;
        $("a.smooth").click(function (s) {
            $("#main-menu li").each(function () {
                    $(this).removeClass("active")
                }), $(this).parent("li").addClass("active"), s.preventDefault(), href = $(this).attr("href"),
                pos = $(href).position().top - 30
        })
    </script>
    <script src="https://cdn.jsdelivr.net/gh/linxuesong/cdn/js/sourceshare/bootstrap.min.js"></script>
    <script src="https://cdn.jsdelivr.net/gh/linxuesong/cdn/js/sourceshare/TweenMax.min.js"></script>
    <script src="https://cdn.jsdelivr.net/gh/linxuesong/cdn/js/sourceshare/resizeable.js"></script>
    <script src="https://cdn.jsdelivr.net/gh/linxuesong/cdn/js/sourceshare/joinable.js"></script>
    <script src="https://cdn.jsdelivr.net/gh/linxuesong/cdn/js/sourceshare/xenon-api.js"></script>
    <script src="https://cdn.jsdelivr.net/gh/linxuesong/cdn/js/sourceshare/xenon-toggles.js"></script>
<script src="https://cdn.jsdelivr.net/gh/linxuesong/cdn/js/sourceshare/xenon-custom.js"></script>

    </div>

    <div class="ins-search">
    <div class="ins-search-mask"></div>
    <div class="ins-search-container">
        <div class="ins-input-wrapper">
            <input type="text" class="ins-search-input" placeholder="Type something..."/>
            <span class="ins-close ins-selectable"><i class="fa fa-times-circle"></i></span>
        </div>
        <div class="ins-section-wrapper">
            <div class="ins-section-container"></div>
        </div>
    </div>
</div>
<script>
(function (window) {
    var INSIGHT_CONFIG = {
        TRANSLATION: {
            POSTS: 'Posts',
            // PAGES: 'Pages',
            CATEGORIES: 'Categories',
            TAGS: 'Tags',
        },
        ROOT_URL: '/',
        CONTENT_URL: '/content.json',
    };
    window.INSIGHT_CONFIG = INSIGHT_CONFIG;
})(window);
</script>

    <!-- <footer id="footer">
  
  <div class="outer">
    <div id="footer-info" class="inner">
      &copy; 2021 John Doe<br>
      powered_by <a href="http://hexo.io/" target="_blank">Hexo</a>
    </div>
  </div>
</footer> -->
<footer id="colophon" class="site-footer" role="contentinfo">
  <div class="site-info">
    <div class="footertext">
      <div class="img-preload">
        <img src="https://cdn.jsdelivr.net/gh/honjun/cdn@1.6/img/other/wordpress-rotating-ball-o.svg">
        <img src="https://cdn.jsdelivr.net/gh/honjun/cdn@1.6/img/other/disqus-preloader.svg">
      </div>
      <p style="color: #666666;">&copy 2018</p>
    </div>
	<!-- 网站数据统计 -->
        <div class="footer-device">
          <p style="font-family: 'Ubuntu', sans-serif;">
            <span style="color: #ff9999;padding-left: 20px;">
                <!-- 网站运行时间统计 -->
                <i class="fa fa-clock-o" aria-hidden="true"></i>
                <span id="time" align="center">载入时间中...</span>
                <script>
                var now = new Date(); 
                function createtime() { 
                      var grt= new Date("12/12/2018");//在此处修改你的建站时间
                      now.setTime(now.getTime()+250); 
                      days = (now - grt ) / 1000 / 60 / 60 / 24; dnum = Math.floor(days); 
                      hours = (now - grt ) / 1000 / 60 / 60 - (24 * dnum); hnum = Math.floor(hours); 
                      if(String(hnum).length ==1 ){hnum = "0" + hnum;} minutes = (now - grt ) / 1000 /60 - (24 * 60 * dnum) - (60 * hnum); 
                      mnum = Math.floor(minutes); if(String(mnum).length ==1 ){mnum = "0" + mnum;} 
                      seconds = (now - grt ) / 1000 - (24 * 60 * 60 * dnum) - (60 * 60 * hnum) - (60 * mnum); 
                      snum = Math.round(seconds); if(String(snum).length ==1 ){snum = "0" + snum;} 
                      document.getElementById("time").innerHTML = "小破站在各种灾难中苟活了 "+ dnum +" 天 "+hnum + " 小时 " + mnum + " 分 " + snum + " 秒";      
                  } 
                  setInterval("createtime()",250);
                </script>
            </span> 
          </p>
        </div>
        <div class="footer-device">
          <p style="font-family: 'Ubuntu', sans-serif;">
            <span style="color: #b9b9b9;padding-left: 20px;">
              <!-- 全网站字数统计wordcount -->
              <i class="fa fa-line-chart"  aria-hidden="true" style="color: #ff9999;display:inline-block"></i> 博客全站共: <span class="post-count" style="color:#ff9999;">59.9k</span>字</span>
              <!-- 不蒜子网页计数器 -->
              
              <span style="padding-left: 20px;"><i class="fa fa-fire" aria-hidden="true" style="color: #ff9999;display:inline-block"></i><span id="busuanzi_container_site_pv">总访问量： <span id="busuanzi_value_site_pv" style="color:#ff9999;"></span>次</span>
              </span>
              
              
              <span style="padding-left: 20px;"><i class="fa fa-user" aria-hidden="true" style="color: #ff9999;display:inline-block"></i><span id="busuanzi_container_site_uv">总访问人数： <span id="busuanzi_value_site_uv" style="color:#ff9999;"></span>人</span>
              </span>
              
            </span>
          </p>
        </div>
    <div class="footer-device">
    <p style="font-family: 'Ubuntu', sans-serif;">
        <span style="color: #b9b9b9;">Theme <a href="https://github.com/honjun/hexo-theme-sakura" target="_blank" style="color: #b9b9b9;;text-decoration: underline dotted rgba(0, 0, 0, .1);">Sakura</a> <i class="iconfont icon-sakura rotating" style="color: #ffc0cb;display:inline-block"></i> by <a href="https://2heng.xin/" target="_blank" style="color: #b9b9b9;;text-decoration: underline dotted rgba(0, 0, 0, .1);">Mashiro</a>&<a href="https://www.hojun.cn/" target="_blank" style="color: #b9b9b9;;text-decoration: underline dotted rgba(0, 0, 0, .1);">Hojun</a>, Powered by Hexo, Hosted by Coding Pages</a>
        </span>
      </p>
    </div>
  </div><!-- .site-info -->
</footer>

<!-- 指定网页去除网页底部footer的网站信息 -->
<!--  切换页面后需要再显示出来 -->
<!--
<script>
    var url = document.URL.toString();
    var reg = new RegExp("sourceshare");
    var obj = document.getElementById("colophon");
    if(url.match(reg)){
        obj.style.display="none";
    }else {
        obj.style.display="block";
    }
</script>
-->
<!-- <script src="/js/tocbot.js"></script> -->
<script type="text/javascript" src="/js/lib.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/clipboard@2/dist/clipboard.min.js"></script>
<script type="text/javascript" src="/js/InsightSearch.js"></script>
<script type="text/javascript" src="/js/jquery.fancybox.min.js"></script>
<script type="text/javascript" src="/js/zoom.min.js"></script>
<script type="text/javascript" src="/js/sakura-app.js"></script>
<script src="//cdn1.lncld.net/static/js/3.0.4/av-min.js"></script>
<script src='//unpkg.com/valine@1.3.4/dist/Valine.min.js'></script>
<script src="/js/botui.js"></script>
<!-- 不蒜子 网页计数器 -->
<script src="//busuanzi.ibruce.info/busuanzi/2.3/busuanzi.pure.mini.js"></script>
<!-- <script src="https://cdnjs.cloudflare.com/ajax/libs/tocbot/4.4.2/tocbot.min.js"></script> -->
<script type="text/javascript">
/* <![CDATA[ */
if (/Android|webOS|iPhone|iPod|BlackBerry/i.test(navigator.userAgent)) {
  var Poi = {"pjax":"1","movies":{"url": "https://cdn.jsdelivr.net/gh/honjun/hojun@1.2","name":"Unbroken.mp4","live":"close"},"windowheight":"fixed","codelamp":"close","ajaxurl":"","order":"asc","formpostion":"bottom"};
} else {
  var Poi = {"pjax":"1","movies":{"url": "https://cdn.jsdelivr.net/gh/honjun/hojun@1.2","name":"Unbroken.mp4","live":"open"},"windowheight":"auto","codelamp":"close","ajaxurl":"","order":"asc","formpostion":"bottom"};
}
/* ]]> */
</script>
<script>
$(document).ready(function() {
  if ($(".toc").length > 0 && document.body.clientWidth > 1200) {
    if ($(".pattern-center").length > 0) { //有图的情况
      tocbot.init({
          // Where to render the table of contents.
          tocSelector: '.toc', // 放置目录的容器
          // Where to grab the headings to build the table of contents.
          contentSelector: '.entry-content', // 正文内容所在
          // Which headings to grab inside of the contentSelector element.
          scrollSmooth: true,
          headingSelector: 'h1, h2, h3, h4, h5', // 需要索引的标题级别
          headingsOffset: -400,
          scrollSmoothOffset: -85
      });
    } else {
      tocbot.init({
          // Where to render the table of contents.
          tocSelector: '.toc', // 放置目录的容器
          // Where to grab the headings to build the table of contents.
          contentSelector: '.entry-content', // 正文内容所在
          // Which headings to grab inside of the contentSelector element.
          scrollSmooth: true,
          headingSelector: 'h1, h2, h3, h4, h5', // 需要索引的标题级别
          headingsOffset: -85,
          scrollSmoothOffset: -85
      });
    }
    var offsetTop = $('.toc').offset().top - 95;
    window.onscroll = function() {
      var scrollTop = window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop;
      if (scrollTop >= offsetTop) {
        $('.toc').addClass('toc-fixed');
      } else {
        $('.toc').removeClass('toc-fixed');
      }
    }
  }
});
</script>


  <script>
  (function(i,s,o,g,r,a,m){i["DaoVoiceObject"]=r;i[r]=i[r]||function(){(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;a.charset="utf-8";m.parentNode.insertBefore(a,m)})(window,document,"script",('https:' == document.location.protocol ? 'https:' : 'http:') + "//widget.daovoice.io/widget/7e5676fe.js","daovoice");
    daovoice('init', {
      app_id: "7e5676fe"
    });
    daovoice('update');
  </script>
 



    <div class="openNav no-select" style="height: 50px;">
      <div class="iconflat no-select" style="width: 50px; height: 50px;">
        <div class="icon"></div>
      </div>
      <div class="site-branding search-form-submit">
        <i class="iconfont js-toggle-search iconsearch icon-search"></i>
      </div>
    </div>
  </section>
  <div id="mo-nav" class="">
  <div class="m-avatar">
    <img src="https://cdn.jsdelivr.net/gh/linxuesong/cdn/img/avatar.jpg">
  </div>
  <p style="text-align: center; color: #333; font-weight: 900; font-family: 'Ubuntu', sans-serif; letter-spacing: 1.5px">楓の葉lean</p>
  <p style="text-align: center; word-spacing: 20px;">
    
      
        <a href="http://github.com/honjun" class="fa fa-github" target="_blank" style="color: #333; margin-left:20px"></a>
      
        <a href="http://weibo.com/mashirozx?is_all=1" class="fa fa-weibo" target="_blank" style="color: #dd4b39; margin-left:20px"></a>
      
        <a href="https://wpa.qq.com/msgrd?v=3&uin=954655431&site=qq&menu=yes" class="fa fa-qq" target="_blank" style="color: #25c6fe; margin-left:20px"></a>
      
    
  </p>
  <ul id="menu-new-1" class="menu">
    
      <li>
        <a href="/">
          <span class="faa-parent animated-hover">
            <i class="fa  fa-fort-awesome faa-shake" aria-hidden="true"></i>
            首页
          </span>
        </a>
        
      </li>
    
      <li>
        <a href="javascript:;">
          <span class="faa-parent animated-hover">
            <i class="fa  fa-archive faa-shake" aria-hidden="true"></i>
            归档
          </span>
        </a>
        
          <ul class="sub-menu">
            
              <li>
                <a href="/categories/%E6%8A%80%E6%9C%AF/">
                  <i class="fa fa-laptop" aria-hidden="true"></i>
                  技术
                </a>
              </li>
            
              <li>
                <a href="/categories/%E7%94%9F%E6%B4%BB/">
                  <i class="fa fa-file-text-o" aria-hidden="true"></i>
                  生活
                </a>
              </li>
            
              <li>
                <a href="/categories/%E8%B5%84%E6%BA%90/">
                  <i class="fa fa-cloud-download" aria-hidden="true"></i>
                  资源
                </a>
              </li>
            
              <li>
                <a href="/categories/%E9%9A%8F%E6%83%B3/">
                  <i class="fa fa-commenting-o" aria-hidden="true"></i>
                  随想
                </a>
              </li>
            
              <li>
                <a href="/categories/%E8%BD%AC%E8%BD%BD/">
                  <i class="fa fa-book" aria-hidden="true"></i>
                  转载
                </a>
              </li>
            
          </ul>
        
      </li>
    
      <li>
        <a href="javascript:;">
          <span class="faa-parent animated-hover">
            <i class="fa  fa-area-chart faa-vertical" aria-hidden="true"></i>
            文章统计
          </span>
        </a>
        
          <ul class="sub-menu">
            
              <li>
                <a href="/analytics/">
                  <i class="fa fa-area-chart" aria-hidden="true"></i>
                  统计
                </a>
              </li>
            
              <li>
                <a href="/archives/">
                  <i class="fa fa-calendar" aria-hidden="true"></i>
                  日历
                </a>
              </li>
            
              <li>
                <a href="/tags/">
                  <i class="fa fa-tag" aria-hidden="true"></i>
                  标签
                </a>
              </li>
            
              <li>
                <a href="/categories/">
                  <i class="fa fa-bookmark" aria-hidden="true"></i>
                  分类
                </a>
              </li>
            
          </ul>
        
      </li>
    
      <li>
        <a href="javascript:;">
          <span class="faa-parent animated-hover">
            <i class="fa  fa-list-ul faa-vertical" aria-hidden="true"></i>
            清单
          </span>
        </a>
        
          <ul class="sub-menu">
            
              <li>
                <a href="/books/">
                  <i class="fa fa-th-list faa-bounce" aria-hidden="true"></i>
                  书单
                </a>
              </li>
            
              <li>
                <a href="/bangumi/">
                  <i class="fa fa-film faa-vertical" aria-hidden="true"></i>
                  番组
                </a>
              </li>
            
              <li>
                <a href="/music/">
                  <i class="fa fa-headphones" aria-hidden="true"></i>
                  歌单
                </a>
              </li>
            
              <li>
                <a href="/movies/">
                  <i class="fa fa-video-camera" aria-hidden="true"></i>
                  电影
                </a>
              </li>
            
              <li>
                <a href="/games/">
                  <i class="fa fa-gamepad" aria-hidden="true"></i>
                  游戏
                </a>
              </li>
            
              <li>
                <a href="/gallery/">
                  <i class="fa fa-photo" aria-hidden="true"></i>
                  图集
                </a>
              </li>
            
          </ul>
        
      </li>
    
      <li>
        <a href="/comment/">
          <span class="faa-parent animated-hover">
            <i class="fa  fa-pencil-square-o faa-tada" aria-hidden="true"></i>
            留言板
          </span>
        </a>
        
      </li>
    
      <li>
        <a href="javascript:;">
          <span class="faa-parent animated-hover">
            <i class="fa  fa-link faa-shake" aria-hidden="true"></i>
            友人帐
          </span>
        </a>
        
          <ul class="sub-menu">
            
              <li>
                <a href="/links/">
                  <i class="fa fa-handshake-o" aria-hidden="true"></i>
                  小伙伴
                </a>
              </li>
            
              <li>
                <a href="/friendlink_status/">
                  <i class="fa fa-heartbeat faa-shake" aria-hidden="true"></i>
                  健康值
                </a>
              </li>
            
          </ul>
        
      </li>
    
      <li>
        <a href="/donate/">
          <span class="faa-parent animated-hover">
            <i class="fa  fa-heart faa-pulse" aria-hidden="true"></i>
            赞赏
          </span>
        </a>
        
      </li>
    
      <li>
        <a href="/">
          <span class="faa-parent animated-hover">
            <i class="fa  fa-leaf faa-wrench" aria-hidden="true"></i>
            关于
          </span>
        </a>
        
          <ul class="sub-menu">
            
              <li>
                <a href="/sourceshare/">
                  <i class="fa fa-share-alt faa-vertical" aria-hidden="true"></i>
                  分享
                </a>
              </li>
            
              <li>
                <a href="/sitelog/">
                  <i class="fa fa-calculator" aria-hidden="true"></i>
                  建站史
                </a>
              </li>
            
              <li>
                <a href="/todolist">
                  <i class="fa fa-tasks" aria-hidden="true"></i>
                  任务书
                </a>
              </li>
            
              <li>
                <a href="/about/">
                  <i class="fa fa-meetup" aria-hidden="true"></i>
                  我？
                </a>
              </li>
            
              <li>
                <a href="/theme-sakura/">
                  <i class="fa iconfont icon-sakura" aria-hidden="true"></i>
                  主题
                </a>
              </li>
            
              <li>
                <a href="/lab/">
                  <i class="fa fa-cogs" aria-hidden="true"></i>
                  Lab
                </a>
              </li>
            
              <li>
                <a href="/dinoswords">
                  <i class="fa fa-coffee" aria-hidden="true"></i>
                  娱乐
                </a>
              </li>
            
              <li>
                <a href="/client/">
                  <i class="fa fa-android faa-vertical" aria-hidden="true"></i>
                  客户端
                </a>
              </li>
            
          </ul>
        
      </li>
    
      <li>
        <a href="/atom.xml">
          <span class="faa-parent animated-hover">
            <i class="fa  fa-rss faa-pulse" aria-hidden="true"></i>
            RSS
          </span>
        </a>
        
      </li>
    
  </ul>
  <p style="text-align: center; font-size: 13px; color: #b9b9b9;">&copy 2019 hexo-sakura</p>
</div>
<button onclick="topFunction()" class="mobile-cd-top" id="moblieGoTop" title="Go to top" style="display: none;"><i class="fa fa-chevron-up" aria-hidden="true"></i></button>
  <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/aplayer/dist/APlayer.min.css">
<script src="https://cdn.jsdelivr.net/npm/aplayer/dist/APlayer.min.js"></script>
<!-- require MetingJS -->
<script src="https://cdn.jsdelivr.net/npm/meting@2/dist/Meting.min.js"></script>
<style>
  .aplayer .aplayer-lrc {
    height: 35px;
  }
  .aplayer .aplayer-lrc p{
    font-size: 16px;
    font-weight: 700;
    line-height: 18px !important;
  }
  .aplayer .aplayer-lrc p.aplayer-lrc-current{
    color: #FF1493;
  }
  .aplayer.aplayer-narrow .aplayer-body{
    left: -66px !important;
  }
  .aplayer.aplayer-fixed .aplayer-lrc {
    display: none;
  }
  .aplayer .aplayer-lrc.aplayer-lrc-hide {
      display:none !important;
  }
  .aplayer.aplayer-fixed .lrc-show {
    display: block;
    background: rgba(255, 255, 255, 0.8);
  }
</style>
<meting-js

</meting-js>
<script>
  $(function(){
    $('body').on('click', '.aplayer', function(){
      if($('.aplayer-button').hasClass('aplayer-play')) {
        $('.aplayer-lrc').removeClass('lrc-show');
      } else {
        $('.aplayer-lrc').addClass('lrc-show');
      }
    })
  });
</script>
  
    <!--1.界面画板娘-->
    <!-- github仓库链接:https://github.com/stevenjoezhang/live2d-widget-->
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/font-awesome/css/font-awesome.min.css"> 
    <!-- 这条在sakura中已有，可不添加 -->
    <script src="https://cdn.jsdelivr.net/gh/linxuesong/cdn/live2d_qianduan/live2d-widget-master/autoload.js"></script>
    <!--2.樱花飘落背景-->
    <!--
    <script src="https://cdn.jsdelivr.net/gh/wallleap/cdn/js/sakura.js"></script>  
    -->
    <!--3.鼠标移动特效（暂时关闭）-->
    <!--
    <script src="https://cdn.jsdelivr.net/gh/wallleap/cdn/js/xuehua.js"></script>
    -->
    <!--4.图片预加载-->
    <script src="//instant.page/3.0.0" type="module" defer integrity="sha384-OeDn4XE77tdHo8pGtE1apMPmAipjoxUQ++eeJa6EtJCfHlvijigWiJpD7VDPWXV1"></script>
    <!--5.鼠标点击爆炸特效-->
    <script type="text/javascript" src="https://cdn.jsdelivr.net/gh/linxuesong/cdn/js/鼠标特效/鼠标点击爆炸烟花特效JS/meme.js"></script>
    <canvas class="fireworks" style="position:fixed;left:0;top:0;z-index:99999999;pointer-events:none;"></canvas>
    <script type="text/javascript" src="https://cdn.jsdelivr.net/gh/linxuesong/cdn/js/鼠标特效/鼠标点击爆炸烟花特效JS/anime.min.js"></script>
    <script type="text/javascript" src="https://cdn.jsdelivr.net/gh/linxuesong/cdn/js/鼠标特效/鼠标点击爆炸烟花特效JS/fireworks.js"></script> 
    <!--6.明月浩空音乐播放器插件   下面是盗版(歌单比较全)    还有  正版体验版(只有一个歌单加广告)  也可以用注册版(有后台查看系统) 已绑定qq账号1011572950-->
    <!--这个是盗版的-->
    <!--<script src="https://player.lmih.cn/player/js/player.js" id="myhk" key="demo" m="1"></script>-->
    <!--这个是正版的-->
    <script src="https://myhkw.cn/player/js/player.js" id="myhk" key="160897544983" m="1"></script>
    <!-- 7.主题背景换肤功能 -->
    <div class="skin-menu no-select" id="mainskin" style="position: fixed">
 <div class="theme-controls row-container">
  <ul class="menu-list">
   <li id="white-bg"> <i class="fa fa-television" aria-hidden="true"></i></li>
   <li id="sakura-bg"> <i class="iconfont icon-sakura"></i></li>
   <li id="gribs-bg"> <i class="fa fa-slack" aria-hidden="true"></i></li>
   <li id="KAdots-bg"> <i class="iconfont icon-dots"></i></li>
   <li id="totem-bg"> <i class="fa fa-optin-monster" aria-hidden="true"></i></li>
   <li id="pixiv-bg"> <i class="iconfont icon-pixiv"></i></li>
   <li id="bing-bg"> <i class="iconfont icon-bing"></i></li>
   <li id="dark-bg"> <i class="fa fa-moon-o" aria-hidden="true"></i></li>
  </ul>
 </div>
</div>
<canvas id="night-mode-cover"></canvas>
 
    <div class="changeSkin-gear no-select">
  <div class="keys" id="setbtn"> 
   <span id="open-skinMenu"> 点我试试 | SCHEME TOOL  
     <i class="iconfont icon-gear inline-block rotating"></i> 
   </span>
  </div>
</div>

    <div id="mo-nav" class="">
  <div class="m-avatar">
    <img src="https://cdn.jsdelivr.net/gh/linxuesong/cdn/img/avatar.jpg">
  </div>
  <p style="text-align: center; color: #333; font-weight: 900; font-family: 'Ubuntu', sans-serif; letter-spacing: 1.5px">楓の葉lean</p>
  <p style="text-align: center; word-spacing: 20px;">
    
      
        <a href="http://github.com/honjun" class="fa fa-github" target="_blank" style="color: #333; margin-left:20px"></a>
      
        <a href="http://weibo.com/mashirozx?is_all=1" class="fa fa-weibo" target="_blank" style="color: #dd4b39; margin-left:20px"></a>
      
        <a href="https://wpa.qq.com/msgrd?v=3&uin=954655431&site=qq&menu=yes" class="fa fa-qq" target="_blank" style="color: #25c6fe; margin-left:20px"></a>
      
    
  </p>
  <ul id="menu-new-1" class="menu">
    
      <li>
        <a href="/">
          <span class="faa-parent animated-hover">
            <i class="fa  fa-fort-awesome faa-shake" aria-hidden="true"></i>
            首页
          </span>
        </a>
        
      </li>
    
      <li>
        <a href="javascript:;">
          <span class="faa-parent animated-hover">
            <i class="fa  fa-archive faa-shake" aria-hidden="true"></i>
            归档
          </span>
        </a>
        
          <ul class="sub-menu">
            
              <li>
                <a href="/categories/%E6%8A%80%E6%9C%AF/">
                  <i class="fa fa-laptop" aria-hidden="true"></i>
                  技术
                </a>
              </li>
            
              <li>
                <a href="/categories/%E7%94%9F%E6%B4%BB/">
                  <i class="fa fa-file-text-o" aria-hidden="true"></i>
                  生活
                </a>
              </li>
            
              <li>
                <a href="/categories/%E8%B5%84%E6%BA%90/">
                  <i class="fa fa-cloud-download" aria-hidden="true"></i>
                  资源
                </a>
              </li>
            
              <li>
                <a href="/categories/%E9%9A%8F%E6%83%B3/">
                  <i class="fa fa-commenting-o" aria-hidden="true"></i>
                  随想
                </a>
              </li>
            
              <li>
                <a href="/categories/%E8%BD%AC%E8%BD%BD/">
                  <i class="fa fa-book" aria-hidden="true"></i>
                  转载
                </a>
              </li>
            
          </ul>
        
      </li>
    
      <li>
        <a href="javascript:;">
          <span class="faa-parent animated-hover">
            <i class="fa  fa-area-chart faa-vertical" aria-hidden="true"></i>
            文章统计
          </span>
        </a>
        
          <ul class="sub-menu">
            
              <li>
                <a href="/analytics/">
                  <i class="fa fa-area-chart" aria-hidden="true"></i>
                  统计
                </a>
              </li>
            
              <li>
                <a href="/archives/">
                  <i class="fa fa-calendar" aria-hidden="true"></i>
                  日历
                </a>
              </li>
            
              <li>
                <a href="/tags/">
                  <i class="fa fa-tag" aria-hidden="true"></i>
                  标签
                </a>
              </li>
            
              <li>
                <a href="/categories/">
                  <i class="fa fa-bookmark" aria-hidden="true"></i>
                  分类
                </a>
              </li>
            
          </ul>
        
      </li>
    
      <li>
        <a href="javascript:;">
          <span class="faa-parent animated-hover">
            <i class="fa  fa-list-ul faa-vertical" aria-hidden="true"></i>
            清单
          </span>
        </a>
        
          <ul class="sub-menu">
            
              <li>
                <a href="/books/">
                  <i class="fa fa-th-list faa-bounce" aria-hidden="true"></i>
                  书单
                </a>
              </li>
            
              <li>
                <a href="/bangumi/">
                  <i class="fa fa-film faa-vertical" aria-hidden="true"></i>
                  番组
                </a>
              </li>
            
              <li>
                <a href="/music/">
                  <i class="fa fa-headphones" aria-hidden="true"></i>
                  歌单
                </a>
              </li>
            
              <li>
                <a href="/movies/">
                  <i class="fa fa-video-camera" aria-hidden="true"></i>
                  电影
                </a>
              </li>
            
              <li>
                <a href="/games/">
                  <i class="fa fa-gamepad" aria-hidden="true"></i>
                  游戏
                </a>
              </li>
            
              <li>
                <a href="/gallery/">
                  <i class="fa fa-photo" aria-hidden="true"></i>
                  图集
                </a>
              </li>
            
          </ul>
        
      </li>
    
      <li>
        <a href="/comment/">
          <span class="faa-parent animated-hover">
            <i class="fa  fa-pencil-square-o faa-tada" aria-hidden="true"></i>
            留言板
          </span>
        </a>
        
      </li>
    
      <li>
        <a href="javascript:;">
          <span class="faa-parent animated-hover">
            <i class="fa  fa-link faa-shake" aria-hidden="true"></i>
            友人帐
          </span>
        </a>
        
          <ul class="sub-menu">
            
              <li>
                <a href="/links/">
                  <i class="fa fa-handshake-o" aria-hidden="true"></i>
                  小伙伴
                </a>
              </li>
            
              <li>
                <a href="/friendlink_status/">
                  <i class="fa fa-heartbeat faa-shake" aria-hidden="true"></i>
                  健康值
                </a>
              </li>
            
          </ul>
        
      </li>
    
      <li>
        <a href="/donate/">
          <span class="faa-parent animated-hover">
            <i class="fa  fa-heart faa-pulse" aria-hidden="true"></i>
            赞赏
          </span>
        </a>
        
      </li>
    
      <li>
        <a href="/">
          <span class="faa-parent animated-hover">
            <i class="fa  fa-leaf faa-wrench" aria-hidden="true"></i>
            关于
          </span>
        </a>
        
          <ul class="sub-menu">
            
              <li>
                <a href="/sourceshare/">
                  <i class="fa fa-share-alt faa-vertical" aria-hidden="true"></i>
                  分享
                </a>
              </li>
            
              <li>
                <a href="/sitelog/">
                  <i class="fa fa-calculator" aria-hidden="true"></i>
                  建站史
                </a>
              </li>
            
              <li>
                <a href="/todolist">
                  <i class="fa fa-tasks" aria-hidden="true"></i>
                  任务书
                </a>
              </li>
            
              <li>
                <a href="/about/">
                  <i class="fa fa-meetup" aria-hidden="true"></i>
                  我？
                </a>
              </li>
            
              <li>
                <a href="/theme-sakura/">
                  <i class="fa iconfont icon-sakura" aria-hidden="true"></i>
                  主题
                </a>
              </li>
            
              <li>
                <a href="/lab/">
                  <i class="fa fa-cogs" aria-hidden="true"></i>
                  Lab
                </a>
              </li>
            
              <li>
                <a href="/dinoswords">
                  <i class="fa fa-coffee" aria-hidden="true"></i>
                  娱乐
                </a>
              </li>
            
              <li>
                <a href="/client/">
                  <i class="fa fa-android faa-vertical" aria-hidden="true"></i>
                  客户端
                </a>
              </li>
            
          </ul>
        
      </li>
    
      <li>
        <a href="/atom.xml">
          <span class="faa-parent animated-hover">
            <i class="fa  fa-rss faa-pulse" aria-hidden="true"></i>
            RSS
          </span>
        </a>
        
      </li>
    
  </ul>
  <p style="text-align: center; font-size: 13px; color: #b9b9b9;">&copy 2019 hexo-sakura</p>
</div>
<button onclick="topFunction()" class="mobile-cd-top" id="moblieGoTop" title="Go to top" style="display: none;"><i class="fa fa-chevron-up" aria-hidden="true"></i></button>
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/aplayer/dist/APlayer.min.css">
<script src="https://cdn.jsdelivr.net/npm/aplayer/dist/APlayer.min.js"></script>
<!-- require MetingJS -->
<script src="https://cdn.jsdelivr.net/npm/meting@2/dist/Meting.min.js"></script>
<style>
  .aplayer .aplayer-lrc {
    height: 35px;
  }
  .aplayer .aplayer-lrc p{
    font-size: 16px;
    font-weight: 700;
    line-height: 18px !important;
  }
  .aplayer .aplayer-lrc p.aplayer-lrc-current{
    color: #FF1493;
  }
  .aplayer.aplayer-narrow .aplayer-body{
    left: -66px !important;
  }
  .aplayer.aplayer-fixed .aplayer-lrc {
    display: none;
  }
  .aplayer .aplayer-lrc.aplayer-lrc-hide {
      display:none !important;
  }
  .aplayer.aplayer-fixed .lrc-show {
    display: block;
    background: rgba(255, 255, 255, 0.8);
  }
</style>
<meting-js

</meting-js>
<script>
  $(function(){
    $('body').on('click', '.aplayer', function(){
      if($('.aplayer-button').hasClass('aplayer-play')) {
        $('.aplayer-lrc').removeClass('lrc-show');
      } else {
        $('.aplayer-lrc').addClass('lrc-show');
      }
    })
  });
</script> 

	
	

	
	
    <!-- 8.增加红灯笼按钮-->
    <!--深夜模式按钮-->
	<a onclick="switchNightMode()" id="sma"> 
		<i class="fa fa-moon-o" id="nightMode" aria-hidden="true"></i> 
	</a>
    <!--圣诞模式按钮-->  
	<script>
		if (localStorage.getItem('themechris') === '1') {
			document.body.classList.add('themechris');
		}
		else if (matchMedia('(prefers-color-scheme: themechris)').matches) {
			document.body.classList.add('themechris');
		}
	</script>
	<a onclick="switchChrisThemes()" id="switchchristmas">
		<img class="theme-buttonchrismas" src="https://hesifan.top/medias/christmas-img/ball.jpg" title="圣诞模式">
	</a>
    <!--春节模式按钮-->  
	<script>
		if (localStorage.getItem('themespring') === '1') {
			document.body.classList.add('themespring');
		}
		else if (matchMedia('(prefers-color-scheme: themespring)').matches) {
			document.body.classList.add('themespring');
		}
	</script>
    <div onclick="switchSpringThemes()" id="switchspring">
        <img class="theme-button" src="https://hesifan.top/medias/spring-img/denglong.png" title="春节模式">
    </div>
  
    <!--春节主题的大红灯笼-->
        <div class="denglong">
        <div class="deng-box">
            <div class="deng">
                <div class="xian"></div>
                <div class="deng-a">
                    <div class="deng-b"><div class="deng-t">喜迎</div></div>
                </div>
                <div class="shui shui-a"><div class="shui-c"></div><div class="shui-b"></div></div>
            </div>
        </div>
        <div class="deng-box1">
            <div class="deng">
                <div class="xian"></div>
                <div class="deng-a">
                    <div class="deng-b"><div class="deng-t">元旦</div></div>
                </div>
                <div class="shui shui-a"><div class="shui-c"></div><div class="shui-b"></div></div>
            </div>
        </div>
    </div>
	<!--春节主题大红灯笼-->
    <!--可以在你想要展示小挂件的地方加上这个挂件，还没有完善等之后再进行吧-->
    <!--圣诞主题小挂件-->
	<div class="caishendengsd">        
		<div class="caishenxiansd">
			<img class="caishenpicsd" src="https://hesifan.top/medias/christmas-img/2.png">
		</div>              
	</div>
    <!-圣诞主题小挂件结束-->
	<!--春节主题小挂件-->
	<div class="caishendeng">        
		<div class="caishenxianleft">
			<img class="caishenpic fudai" src="https://hesifan.top/medias/spring-img/3.png">
		</div>            
	</div>
	<!-春节主题小挂件结束-->
       <script>
	   // 切换深色模式JS
	   function switchNightMode() {
			var body = document.body; 
			if(body.classList.contains('dark')){ 
				document.body.classList.remove('dark'); 
				localStorage.setItem('dark','0'); 
				$('#nightMode').removeClass("fa-lightbulb-o").addClass("fa-moon-o"); 
				return; 
			} else {
				document.body.classList.add('dark'); 
				localStorage.setItem('dark','1'); 
				$('#nightMode').removeClass("fa-moon-o").addClass("fa-lightbulb-o"); 
				return; 
			} 
	   }
	       // 中国节日按钮切换
	
    function switchSpringThemes() {
        var body = document.body;
        if(body.classList.contains('themechris')){
            document.body.classList.remove('themechris');
            localStorage.setItem('themechris','0');
            document.body.classList.add('themespring');
            localStorage.setItem('themespring','1');
            return;
        }
        if(body.classList.contains('themespring')){
        document.body.classList.remove('themespring');
        localStorage.setItem('themespring','0');
        return;
        } else {
        document.body.classList.add('themespring');
        localStorage.setItem('themespring','1');
		
        return;
        }
    };

    // 圣诞节按钮切换
    function switchChrisThemes() {
        var body = document.body;
        if(body.classList.contains('themespring')){
            document.body.classList.remove('themespring');
            localStorage.setItem('themespring','0');
            document.body.classList.add('themechris');
            localStorage.setItem('themechris','1');
            return;
        }
        if(body.classList.contains('themechris')){
        document.body.classList.remove('themechris');
        localStorage.setItem('themechris','0');
        return;
        } else {
        document.body.classList.add('themechris');
        localStorage.setItem('themechris','1');
        return;
        }
    };
	</script>
</body>
</html>
